美文网首页
原型链相关问题

原型链相关问题

作者: miao8862 | 来源:发表于2021-04-02 23:20 被阅读0次

创建对象有几种方法

  1. 使用对象字面量的方式创建
// 字面量
var o1 = {name: "o1"} // {name: "o2"}
// 下面这种虽然也是构造函数,但生成的对象本质上和上面字面量相同 
var o2 = new Object({name: "o2"}) // {name: "o2"}
  1. 使用构造函数创建对象
var M = function(name){this.name = name}
var o3 = new M("hhh") // M {name: "hhh"}
  1. 使用Object.create()方法创建
var p = {name: "p"}
var o4 = Object.create(p)  // {}
console.log(o4.name) // p

原型、构造函数、实例、原型链

概念:

  • 原型: 原型是函数对象的一个prototype属性(公有属性),它定义了构造函数制造出的对象(实例对象)的公共祖先。通过构造函数产生的实例对象,可以继承该原型的属性和方法
  • 构造函数:使用new,这个函数就是构造函数
  • 实例:通过构造函数创建的对象,就称为实例
  • 原型链:原型链是指从当前对象的原型中,一直往其上的原型遍历,直至Object的原型,这条链称为原型链

它们之间的关系:


prototype.png
  1. 构造函数通过new来创建实例
    如上面的例子,o2就是实例
  2. 实例的proto就是构造函数的prototype,也就是我们说的原型对象,原型对象是被不同的实例所共同拥有的
  o3.__proto__ === Person.prototype // true
  Person.prototype.constructor === M // true
  1. 只有构造函数有prototype属性,而只有实例对象有proto属性,如果发现函数既有prototype属性,也有proto属性,说明这个函数既是一个构造函数,又是一个实例对象
  M.__proto__ === Function.prototype // M是Function的实例对象
  o3.__proto__ ===  M.prototype // 又是o3实例对象的构造函数

instanceof的原理

instanceof的原理是查找构造函数的 prototype 属性是否出现在对象原型链上

  o3 instanceof M // true
  o3.__proto__ === M.prototype // true
  o3 instanceof Object // true
  M.prototype.__proto__ === Object.prototype //true

  // 要判断o3是M还是Object的实例,可以使用constructor来判断,使用constructor来判断会比instanceof严谨
  o3.__proto__.constructor === M  // true
  o3.__proto__.constructor === Object // false
// js实现instanceof,L为实例对象,R为构造函数
const instanceofFunc(L, R) {
  const left = L.__proto__
  const right = R.prototype
  while(true) {
    if(left === null) {
      return false
    }else {
      if(left === right) {
        return true
      }else {
        left = left.__proto__
      }
    }
  }
}

new运算符

原理:

  1. 一个新对象{}被创建
  2. 将新对象的原型链接到构造函数的原型链上
  3. 将构造函数的this指向新对象,并执行构造函数
  4. 执行结果如果返回一个对象,而返回这个对象,否则返回第2步创建的新对象
  // 实现一个new方法 
    var new2 = function(func) {
      // 这一步相当于, 创建一个新对象{},并将新对象的__proto__链接到func的原型链上,即o.__proto__ === func.prototype
      var o = Object.create(func.prototype)
      var k = func.call(o)
      if(typeof k === 'object') {
        return k
      }else {
        return o
      }
    }

相关文章

  • 原型链相关问题

    问题7:有如下代码,解释Person、 prototype、proto、p、constructor之间的关联。 问...

  • 原型链相关问题

    1、有如下代码,解释Person、 prototype、__proto__、p、constructor之间的关联。...

  • 原型链相关问题

    创建对象有几种方法 使用对象字面量的方式创建 使用构造函数创建对象 使用Object.create()方法创建 原...

  • this_原型链_继承

    this部分 原型链相关问题问题7:有如下代码,解释Person、 prototype、proto、p、const...

  • this_原型链_继承

    this部分链接 原型链相关问题 问题7:有如下代码,解释Person、 prototype、proto、p、co...

  • JavaScript的原型链相关问题

    问题1:有如下代码,解释Person、 prototype、__proto__、p、constructor之间的关...

  • this_原型链_继承相关问题

    在函数被直接调用时this绑定到全局对象。在浏览器中,window 就是该全局对象,函数调用模式this指向win...

  • 原型链和继承相关问题

    1、有如下代码,解释Person、 prototype、proto、p、constructor之间的关联。 关联:...

  • this、原型链、继承

    1. this2.原型链-instanceof实现3.继承的实现 ** this 相关问题 ** ** 1、 ap...

  • JS的__proto__和prototype

    最近在回顾JS的原型和原型链的知识,熟悉JS的同学都知道JS的继承是靠原型链实现的,那跟原型链相关的属性__pro...

网友评论

      本文标题:原型链相关问题

      本文链接:https://www.haomeiwen.com/subject/hnkckltx.html