JavaScript

OO in JS（1）

创建对象

工厂模式

1
2
3
4
5
6
7
8
9
10
11
12
// 按照我的理解此时生成了一个prototype，constructor为Person1
function Person1(name) {
  let o = new Object() // 等价于let o = {}，注意new的是Object
  o.name = name
  o.sayName = function () {}
  return o
}
let person1 = Person1('Orion')
Person1.prototype // __proto__为Obejct的只有constructor的对象，代表该构造函数对应的prototype
person1.__proto__ // Object，代表该实例的原型对象
person1 instanceof Person1 // false，是Object
person1.constructor === Person1 // false，是Object

构造函数 constructor

1
2
3
4
5
6
7
8
9
function Person2 (name) {
  this.name = name
  this.sayName = function () {}
}
var person2 = new Person2('Orion') // 相当于创建一个Person2.prototype对象，只有constructor才可以使用new，比如不可以new person2()
Person2.prototype // __proto__为Obejct的只有constructor的对象
person2.__proto__ // 同上
person2 instanceof Person2 // true
person2.constructor === Person2 // true

原型模式

1
2
3
4
5
6
7
8
9
// 构造函数
function Person3 () {}
Person3.prototype.name = 'Orion'
Person3.prototype.sayName = function () {}
let person3 = new Person3() // 不带()也可以，new Person
Person3.prototype // __proto__为Obejct的有constructor、name和sayName的对象
person3.__proto__ // 同上
person3 instanceof Person3 // true
person3.constructor === Person3 // true

对象字面量封装

1
2
3
4
5
6
7
8
9
10
11
12
// constructor是在这一步被添加到prototype中去的
function Person4 () {}
// 这里把原来prototype替换掉了，于是constructor也没了
Person4.prototype = {
  name: 'Orion',
  sayName: function () {}
}
let person4 = new Person4()
Person4.prototype // __proto__为Obejct的只有name和sayName的对象
person4.__proto__ // 同上
person4 instanceof Person4 // true
person4.constructor === Person4 // false