Day17

1-jquery 中的$.each 和$(选择器).each()有什么区别？

我们都用过Jqurey中的each函数，都知道each()有两种方式去调用，一种是通过$.each()调用，另一种是$(selector).each()去调用，那么它们之间有什么区别？

　　翻看一下Jquery源码就会知道，$.each()是核心的实现，$(selector).each()是调用的$.each()，先来分析一下$.each()的源码(在底部)：

 　  each(obj,callback,args)函数接收3个参数：obj--要遍历的对象或数组、callback--要遍历执行的回调函数、args--自己指定的数组（先无视）。

当调用each()有第三个参数的时候，便会进入下面的代码块，来分析下：

　　　　if(isArray) {
            for(; i < length; i++) {
                value = callback.apply(obj[i], args);
                if(value === false) { break; }
            }
        } else {
            for(i in obj) {
                value = callback.apply(obj[i], args);
                if(value === false) { break; }
            }
        }
　　　　同样道理，会先判断你要遍历的对象是否是数组，如果是数组，则遍历数组的元素obj[i]，并执行obj[i].callback(args)
　　　　注意！这个地方传的参数是你自己传进来的args数组，这是和没有args参数不一样的地方，也就是说如果你调用each函数是传入了自己的数组参数，回调函数的参数列表就是你所传的args数组。
　　　　其他的同上。
$(selector).each(callback,args)函数接收2个参数：callback--要遍历执行的回调函数、args--自己指定的数组。

2-query 中的$.each 和 js 中的 foeEach()有什么区别？

 $(function(){

    // 3.1遍历数组

    var arr = [1, 3, 5, 7, 9];

    // 3.1.1通过原生方法遍历数组

    // 第一个回调函数参数是遍历到的元素

    // 第二个回调函数参数是当前遍历的索引

    // 返回值：没有返回值

    var res = arr.forEach(function(ele, idx){

      console.log(idx, ele);

    });

    console.log(res);

    // 3.1.2通过jQuery静态方法遍历数组

    // 第一个回调函数参数是当前遍历的索引

    // 第二个回调函数参数是遍历到的元素

    // 返回值：被遍历的数组

    var $res2 = $.each(arr, function(idx, ele){

      console.log(idx, ele);

    });

    console.log($res2);

    // 3.2遍历对象

    var obj = {name:"lnj",age:"33",gender:"male"};

    // 3.2.1 js对象没有forEach方法，所以通过for in方法遍历对象

    for(var key in obj){

      console.log(key, obj[key]);

    }

    // 3.2.2 通过jQuery静态方法遍历对象

    $.each(obj,function(key, value){

      console.log(key, value);

    });

  });

</script>

 

1.在遍历数组时：

回调函数中参数的位置不一样，forEach中为第一个参数为ele，第二个为index。each中第一个为index，第二个为ele；

回调函数中是否有返回值，forEach中没有返回值，each有返回值，返回被遍历的数组

2.遍历对象

forEach不能遍历对象，可以使用for in;

而each可以通过jq的讲台方法来遍历，即$.each(obj,function(key,value){})

3-window.onload 和$(docuMent).ready() 有什么区别？

window.onload是Javascript中得函数，意思是：等待网页中所有内容加载完毕之后（包括图片）；
而$(documetn).ready()是在网页中的所有DOM结构绘制完毕之后就可以执行了，可能有与DOM关联的元素还没有加载完，所以相比之下更快一些；

window.onload=function(){

  alert('I am No.1');

};

window.onload=function(){

 alert('I am No.2');

}

结果只能输出“I am No.2”

而换成：

$(document).ready(function(){

alert('I am No.1');

});

$(document).ready(function(){

alert('I am No.2');

});

结果输出 I am  No.1  ,I am No.2

4-jquery 实现链式编程的原理是什么？

节约JS代码；

所返回的都是同一个对象，可以提高代码的效率。

通过简单扩展原型方法并通过return this的形式来实现跨浏览器的链式调用。利用JS下的简单工厂方法模式，来将所有对于同一个DOM对象的操作指定同一个实例。