优化keydown

timmyLan · Jan 23, 2017 · 25364c4 · 25364c4
1 parent 1ddcba2
commit 25364c4
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/second-step/index.js b/second-step/index.js
@@ -50,10 +50,14 @@ class Block {
                 left = parseInt(activeModel.style.left) ? parseInt(activeModel.style.left) : 0,
                 top = parseInt(activeModel.style.top) ? parseInt(activeModel.style.top) : 0;
             const key = e.keyCode;
-            const {canMoveRight, canMoveLeft, canMoveTop, canMoveDown} = this.canMove();
+            let canMoveRight,
+                canMoveLeft,
+                canMoveTop,
+                canMoveDown;
             switch (key) {
                 //left
                 case 37:
+                    canMoveLeft = this.canMove().canMoveLeft;
                     if (canMoveLeft) {
                         activeModel.style.left = `${left - 20}px`;
                     } else {
@@ -62,6 +66,7 @@ class Block {
                     break;
                 //up
                 case 38:
+                    canMoveTop = this.canMove().canMoveTop;
                     if (canMoveTop) {
                         activeModel.style.top = `${top - 20}px`;
                     } else {
@@ -70,6 +75,7 @@ class Block {
                     break;
                 //right
                 case 39:
+                    canMoveRight = this.canMove().canMoveRight;
                     if (canMoveRight) {
                         activeModel.style.left = `${left + 20}px`;
                     } else {
@@ -78,6 +84,7 @@ class Block {
                     break;
                 //down
                 case 40:
+                    canMoveDown = this.canMove().canMoveDown;
                     if (canMoveDown) {
                         activeModel.style.top = `${top + 20}px`;
                     } else {

diff --git a/third-step/index.js b/third-step/index.js
@@ -88,10 +88,14 @@ class Block {
         document.onkeydown = (e)=> {
             let activeModel = document.querySelectorAll('.activityModel');
             const key = e.keyCode;
-            const {canMoveRight, canMoveLeft, canMoveTop, canMoveDown} = this.canMove();
+            let canMoveRight,
+                canMoveLeft,
+                canMoveTop,
+                canMoveDown;
             switch (key) {
                 //left
                 case 37:
+                    canMoveLeft = this.canMove().canMoveLeft;
                     if (canMoveLeft) {
                         for (let v of activeModel) {
                             v.style.left = `${parseInt(v.style.left) - 20}px`;
@@ -102,6 +106,7 @@ class Block {
                     break;
                 //up
                 case 38:
+                    canMoveTop = this.canMove().canMoveTop;
                     if (canMoveTop) {
                         for (let v of activeModel) {
                             v.style.top = `${parseInt(v.style.top) - 20}px`;
@@ -112,6 +117,7 @@ class Block {
                     break;
                 //right
                 case 39:
+                    canMoveRight = this.canMove().canMoveRight;
                     if (canMoveRight) {
                         for (let v of activeModel) {
                             v.style.left = `${parseInt(v.style.left) + 20}px`;
@@ -122,6 +128,7 @@ class Block {
                     break;
                 //down
                 case 40:
+                    canMoveDown = this.canMove().canMoveDown;
                     if (canMoveDown) {
                         for (let v of activeModel) {
                             v.style.top = `${parseInt(v.style.top) + 20}px`;