jQuery原型链分析

lidashuang 发布于2019-08-23 10:43 / 2338人阅读

摘要：前言自己搭建了个仿的原型设计，的原型设计也是按这样来实现的，简单的说就是让的原型对象和的原型对象共用，然后一个，很容易理解吧正文若环境存在则执行初始化进行匹配，比如等让的原型对象指向的原型功能循环设置指向问题挂载到测试结果

前言

自己搭建了个仿jQuery的原型设计，JQuery的原型设计也是按这样来实现的，简单的说就是让_mJQ.init的原型对象和_mJQ的原型对象共用，然后new 一个_mJQ.init，很容易理解吧

正文

(function(global, factory) {
    if (typeof global.document === "undefined") {
        throw new Error("the environment must have a window Object with document !")
    }
    // 若环境存在则执行factory
    factory(global);
})(typeof window !== "undefined" ? window : this, function (window) {
    var _mJQ = function (selector) {
        return new _mJQ.init(selector);
    }
    // 初始化
    _mJQ.init = function(selector) {
        // 进行selector匹配，比如class,attr,id等...
        if (selector === "#test") {
            const elem = document.getElementById("test")
            this.elem = elem
            return this
        }
        return this
    }
    // 让init的原型对象指向_mJQ的原型
    _mJQ.init.prototype = _mJQ.prototype = {
        // 功能
        each: function() {
            // 循环
        },
        html: function() {},
        css: function (name, value) {
            console.log(this)
            this.elem.style[name] = value
        }
    }
    // 设置contructor指向问题
    Object.defineProperty(_mJQ.prototype, "constructor", {
        enumerable: false,
        value: _mJQ
    })
    // 挂载到window
    window.$ = window.mJQ = _mJQ;
})

测试结果

云服务器 GPU云服务器原型原型链原型链原型链继承原型链图

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/96623.html

原型（prototype）相关方法，jquery类型判断源码分析。

摘要：先来看一个这样的对象在函数的原型上扩展了一个方法可以看到实例化的对象下有一个属性，而这个属性就指向构造函数的原型对象。重点是，连接的是实例对象与构造函数原型对象，而不是，实例对象和构造函数。前言介绍原型的概念，和相关属性，以及jquery判断纯净对象的实现，不小心点进来的直接 ctrl+f 搜你想找的属性。什么是原型 isPrototypeOf() || Object.getP...

madthumb 2019-08-20 19:09 评论0 收藏0
Lodash 严重安全漏洞背后你不得不知道的 JavaScript 知识

摘要：可能有信息敏感的同学已经了解到库爆出严重安全漏洞，波及万项目。以此为例，可见这次漏洞算是比较严重了。此外，冻结一个对象后该对象的原型也不能被修改。摘要：详解原型污染。原文：Lodash 严重安全漏洞背后你不得不知道的 JavaScript 知识作者：Lucas HC Fundebug经授权转载，版权归原作者所有。可能有信息敏感的同学已经了解到：Lodash 库爆出严...

YorkChen 2019-08-26 10:15 评论0 收藏0
最新：Lodash 严重安全漏洞背后你不得不知道的 JavaScript 知识

摘要：可能有信息敏感的同学已经了解到库爆出严重安全漏洞，波及万项目。以此为例，可见这次漏洞算是比较严重了。此外，冻结一个对象后该对象的原型也不能被修改。使用数据结构，不会存在原型污染状况。可能有信息敏感的同学已经了解到：Lodash 库爆出严重安全漏洞，波及 400万+ 项目。这个漏洞使得 lodash 连夜发版以解决潜在问题，并强烈建议开发者升级版本。我们在忙着看热闹或者升级版本的同时...

Integ 2019-08-23 18:37 评论0 收藏0
进击的 JavaScript （七）之原型链

摘要：创建一个新的对象即实例对象把新对象的指向后面构造函数的原型对象。简单来验证一下等同与对象没有原型对象的原型对像等同于构造函数是等同于，构造函数是七原型链的作用其实，原型链的根本作用就是为了属性的读取。首先说一下，函数创建的相关知识在JavaScript中，我们创建一个函数A(就是声明一个函数), 那么 js引擎就会用构造函数Function来创建这个函数。所以，所有的函数的con...

ivydom 2019-08-22 17:13 评论0 收藏0
underscore源码剖析之整体架构

摘要：我这里有个不够准确但容易理解的说法，就是检查一个对象是否为另一个构造函数的实例，为了更容易理解，下面将全部以是的实例的方式来说。 underscore源码分析之整体架构最近打算好好看看underscore源码，一个是因为自己确实水平不够，另一个是underscore源码比较简单，比较易读。本系列打算对underscore1.8.3中关键函数源码进行分析，希望做到最详细的源码分析。今...

2shou 2019-08-22 15:27 评论0 收藏0