zoukankan      html  css  js  c++  java
  • jQuery源码笔记——四

    each()实现

    var jQuery = function( selector, context ) {
            return new jQuery.fn.init( selector, context );
    };
    jQuery.fn = jQuery.prototype = {
        selector: "",
        init: function(selector){
            //仍然是mini的选择器。
            var result = document.querySelectorAll(selector);
            for(var i = 0;i < result.length;i++){
                this[i] = result[i] 
            }
            this.length = result.length;
        },
        //指定操作对象为this
        each: function(callback){
            return jQuery.each(this,callback)
        },
        constructor : jQuery
    }
    jQuery.fn.init.prototype = jQuery.fn
    //对任意对象进行迭代操作
    jQuery.each = function(obj,callback){
        for(var i = 0;i<obj.length;i++){
            //运用call调整this的指向
            //回调函数里的this指向操作的对象
            //方便操作
            callback.call(obj[i],i,obj[i]);
        }
        //链式调用
        return obj
    }
    //测试
    jQuery("div").each(function(index, element) {
        console.log(this)
    });
    //jQ内部也经常用迭代操作数组或其它。
    jQuery.each("Boolean Number String Function Array Date RegExp Object Error".split(" "), function(i, name) {
        console.log(name.toLowerCase())
    });

    jQuery.each是jQuery的工具,迭代操作对象合集里的对象,所以不用继承在原型中,而jQuery.fn.each就是jQuery.each的一个特例。

    each是一个典型的迭代运用,如我们想对一个合集的对象都执行的某功能,callback,通过each遍历对象或者数组就可以实现不停变化callback的操作对象。

    原理很简单就是将元素遍历依次传给回调函数,原代码中还考虑了一些情况,但没什么新知识,我就不补充了。

    回调函数

    作为参数的函数就叫回调函数。当一个函数接收一个函数

  • 相关阅读:
    Amount of Degrees(数位dp)
    【BZOJ2820】【XSY1721】GCD(莫比乌斯反演)
    【XSY2671】【BZOJ2693】jzptab(莫比乌斯反演)
    【模板】莫比乌斯反演
    CDQ分治&&整体二分
    线性方程组之高斯消元
    矢量及【模板】二维凸包
    回收数据表Ⅰ
    Spring的bean管理(注解)
    jquery与ajax的XMLHttpRequest对象介绍
  • 原文地址:https://www.cnblogs.com/winderby/p/4081892.html
Copyright © 2011-2022 走看看