• 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的操作对象。

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

    回调函数

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

  • 相关阅读:
    Python numpy.transpose 详解
    如何理解张量tensor
    tensorflow中张量的理解
    Theano入门——CIFAR-10和CIFAR-100数据集
    阻止form表单提交的问题
    webp图片优化
    Css控制网页变灰
    express-session相关用法
    REM+SVG Sprite,web app案例
    HTML 5 Audio/Video DOM canplaythrough 事件在移动端遇到的坑
  • 原文地址:https://www.cnblogs.com/winderby/p/4081892.html
Copyright © 2020-2023  润新知