原型链相关

188 阅读2分钟

创建对象的方法

字面量

var ob1 = {name:'ob1'}
var ob2 = new Object({name:'ob2'})

构造函数

var Myo = function(name){this.name=name}
var ob3 = new Myo('ob3')

* Project.creat

var p = {name:'ob4'}
var ob4 = Object.create(p)

原型链

  var Myo = function(name){
    this.name=name
  }
  Myo.prototype.say = function(){
    console.log('hi')
  }
  var ob = new Myo('tatekii')
实例对象:
Myo {name: "tatekii"}
  name: "tatekii"
  __proto__: Object

实例对象.__proto__:{say: ƒ, constructor: ƒ}
  say: ƒ ()
  constructor: ƒ (name)
  __proto__: Object
// 实例对象中没有constructor,JS会顺着原型链寻找到实例对象的__proto__的constructor

实例对象.constructor:
ƒ (name){
    this.name=name
  }

实例对象.__proto__.constructor:
ƒ (name){
    this.name=name
  }
// 通过给构造函数的prototype添加say方法,则在实例对象中say()时,JS会顺着原型链寻找到实例的__proto__,由于其指向和构造函数的prototype一致,就可以使用say()方法
ob.say()  // hi

构造函数.prototype:{say: ƒ, constructor: ƒ}
  say: ƒ ()
  constructor: ƒ (name)
  __proto__: Object

实例对象.__proto__:{say: ƒ, constructor: ƒ}
  say: ƒ ()
  constructor: ƒ (name)
  __proto__: Object

new 构造函数 ==> 实例

构造函数.prototype ==> 原型对象

原型对象.constructor ==> 构造函数 // 这个原型对象是被谁引用的

构造函数.prototype.constructor === 构造函数

实例对象.__proto__ === 原型对象 === 构造函数.prototype

原型对象上的方法是被实例对象(们)共享的

原型链:js从实例对象的\_proto_一直延续到Object.prototype

函数才有prototype

构造函数.__proto__ === Function.prototype // 函数也是对象

instanceof 判断原型链

实例对象.__proto__ === 构造函数.prototype //true
构造函数.prototype.__proto__ === Object.prototype //true
...
实例对象 instanceof 构造函数 //true
实例对象 instanceof Object //true

constructor 判断构造函数

实例对象.__proto__.constructor === 构造函数 //true
实例对象.__proto__.constructor === Object  //false

new运算符

[MDN] developer.mozilla.org/zh-CN/docs/…

  1. new 构造函数,新建一个空对象,继承构造函数.prototype原型对象

  2. 构造函数被执行,相应参数被传入,this指定为这个新实例(不传参的情况下new foo等同于new foo())

  3. 如果构造函数返回了一个对象,则该对象取代new出来的结果,如果构造函数没有返回,则结果就是步骤1

var new1 = function(func){
  var o = Object.create(func.prototype)
  var k = func.call(o)
  if(typeof k === 'object'){
    return k
  }else{
    return o
  }
}
var o1 = new1(Myo)

*关于文首创建对象的第三种方法

var p = {name:'obname'}
var ob4 = Object.create(p)
//
new运算符的步骤中
---->Object.create(--->func.prototype<---)<----
这里func.prototype == {name:'obname'} ==> ob4.__proto__

ob4中没有name属性,但js会顺着原型链向上找到ob4的__proto__中发现有name
console --> ob = Object {}
            ob4.name = 'obname'
//