整体架构

2017-11-16  本文已影响0人  我_巨可爱

常见构造函数创建实例和无new创建实例。原文地址

// 无new创建
function Test() {
  // 不能使用 this
  return new Object()
}
// new 有神奇的作用
function Test() {}; new Test();

jquery代码

jQuery = function (selector,context) {
  return new jQuery.prototype.init()
}
jQuery.prototype = {
  init: function () {
    this.name = 
    return this
  },
  say: function () {}
}
jQuery.prototype.init.prototype = jQuery.prototype
  1. return new 类是为了无new和隔离各个实例
  2. new作用
  1. initthis无法获取jQuery上的方法,因此原型重定向

小案例分析

$().say()
  1. 由于返回的是init对象,会通过__proto__查询initprototype上有没有
  2. init原型上本来没有,由于原型成定向,它又指向jQuery上的prototype
  3. 由于jQuery上的prototype有该方法,所以调用

链式调用

  1. 方法在必要的时候返回this

插件接口

  1. 使用的是extend,因此,我们就来看看extend函数
jQuery.extend = jQuery.fn.extend = function () {
  // 初始化变量
  // 处理各种,不同参数导致的问题
  // 主要逻辑
  for () {
    // 第一层,循环各个source
    if () {
      // 如果是对象
      for () {
        // 第二层,遍历对象各个属性
        if () {
          // 如果,属性值是对象或数组,递归
        }else {
          // 如果,属性值不是对象或数组,直接赋值
        }
      }
    }
  }
  // return 改变后的目标
}

总结

  1. 整体框架,一些伪代码,然后细化
上一篇 下一篇

猜你喜欢

热点阅读