关于JS那些容易被你忽略的那些点（3）

demo eleven

不知道你前面的理解的怎么样了。现在你来判断下下面代码的输出

for (var i = 0; i < 5; i++) {  var btn = document.createElement('button');  btn.appendChild(document.createTextNode('Button ' + i));  btn.addEventListener('click', function(){ console.log(i); });  document.body.appendChild(btn);}

很眼熟对不对，没错，稍微改下就能完成想要实现的功能了

for (var i = 0; i < 5; i++) {  var btn = document.createElement('button');  btn.appendChild(document.createTextNode('Button ' + i));  (function(i){  btn.addEventListener('click', function(){ console.log(i); });  })(i);  document.body.appendChild(btn);}

你自己再控制台可以试一试，看是不是实现功能了

demo twelve

那么再来判断下下面这段代码

var arr1 = "john".split(''); j o h nvar arr2 = arr1.reverse(); n h o jvar arr3 = "jones".split(''); j o n e sarr2.push(arr3);console.log("array 1: length=" + arr1.length + " last=" + arr1.slice(-1));console.log("array 2: length=" + arr2.length + " last=" + arr2.slice(-1));

有两个要点，第一个是reverse()方法会将原数组改变，即arr1会变成n h o j

另外一个要点是类似以a = [0,1,2,3] , b = a这种形式的，如果改变b的值会使a的值也改变但是如果重新给b赋值则b的值不会进行改变

var a = [10,11,12]var b = a;b.push(55);console.log(b);console.log(a);

那如果是下面这种情况呢

var a = [10,11,12]var b = a;b = [1,2,5,8]console.log(b);console.log(a);

运行一下答案就很明显了

demo thirteen

直接上代码

console.log(1 +  "2" + "2");console.log(1 +  +"2" + "2");console.log(1 +  -"1" + "2");console.log(+"1" +  "1" + "2");console.log( "A" - "B" + "2");console.log( "A" - "B" + 2);

记住几条规则

1.在数字字符串前面有“ + ”、“ - ”号的，运算过程中会将其转换为数字

2.对于无法运算的字符串，会返回NaN

demo fourteen

直接贴代码

for(var i = 0; i < 5; i++) {    (function(i) {      setTimeout(function() {        console.log(i);        }, i*1000);    })(i)}

这道题之前提到过，但是由于上次只解决了一直输出5的问题，而忽略了另外一个问题。

这道题的原本目的是让每执行一次延时时间+1S，但是运行后会发现间隔一直只有一秒。

这是因为for循环执行很快，每次循环几乎是同时执行，所以导致了你觉得每次延时只有一秒钟

demo fifteen

var hero = {    _name: 'John Doe',    getSecretIdentity: function (){        return this._name;    }};var stoleSecretIdentity = hero.getSecretIdentity;console.log(stoleSecretIdentity());console.log(hero.getSecretIdentity());

执行后结果并不是我们想要的。

这是因为stoleSecretIdentity的执行环境是全局，而getSecretIdentity的执行环境是hero，咱们可以这样进行修改

var hero = {    _name: 'John Doe',    getSecretIdentity: function (){        return this._name;    }};var stoleSecretIdentity = hero.getSecretIdentity;console.log(stoleSecretIdentity.call(hero));console.log(hero.getSecretIdentity());