js 一些细节 持续更新

for(var i=0;i<5;i++){
  (function (j) {
    setTimeout(function () {
      console.log(new Date,j)
    },2000)
    })(i);
}
console.log(new Date,i)    //5    1秒后01234

for (var i = 0; i < 5; i++) {
    (function(j) {
        setTimeout(function() {
            console.log(new Date, j);
        }, 1000 * j));  // 这里修改 0~4 的定时器时间
    })(i);
}

setTimeout(function() { // 这里增加定时器，超时设置为 5 秒
    console.log(new Date, i);
}, 1000 * i);    //最终输出为012345 0立即输出，其他每个1秒输出一个

 

2 http常见状态码：200 304 404 500

 

3.事件监听：addEventListener  attachEvent  removeEventListener，优点是可以绑定(解绑）多个事件

   事件委托：利用冒泡机制，把事件加到父元素或祖先元素上，触发执行效果。

优点：会加快js执行速度

var item1 = document.getElementById("item1");
var item2 = document.getElementById("item2");
var item3 = document.getElementById("item3");

document.addEventListener("click",function(event){
var target = event.target;
  if(target == item1){
    alert("hello item1");
  }else if(target == item2){
    alert("hello item2");
  }else if(target == item3){
    alert("hello item3");
  }
})

也可以动态添加dom元素

<ul id="list">
<li id="item1" >item1</li>
<li id="item2" >item2</li>
<li id="item3" >item3</li>
</ul>

<script>
var list = document.getElementById("list");

document.addEventListener("click",function(event){
  var target = event.target;
  if(target.nodeName == "LI"){
    alert(target.innerHTML);
  }
})

var node=document.createElement("li");
var textnode=document.createTextNode("item4");
node.appendChild(textnode);
list.appendChild(node);

</script>

 4.利用promise实现3灯无限切换（利用递归）

  function red(){
    console.log('red');
  }
  function green(){
    console.log('green');
  }
  function yellow(){
    console.log('yellow');
  }

  var light = function(timmer, cb){
    return new Promise(function(resolve, reject) {
      setTimeout(function() {
        cb();
        resolve();
      }, timmer);
    });
  };

  var d = new Promise(function(resolve, reject){resolve();});
  var step = function(def) {
    def.then(function(){
      return light(3000, red);
    }).then(function(){
      return light(2000, green);
    }).then(function(){
      return light(1000, yellow);
    }).then(function(){
      step(def);
    });
  }

  step(d);

 5.哪里不适合使用箭头函数：a.定义字面量方法时（应该使用es6的方法简写fn()）  b.定义原型方法时(应使用es5)  c.定义事件回调函数时 d.定义构造函数时

6.AMD: RequireJS的规范化产出，依赖前置，异步模块定义

CMD: SeaJS的规范化产出，依赖就近，同步模块定义

CommonJS: module.exports     node.js使用 前端不支持

ES6:  import  export