1. 程式人生 > >JavaScript 原型模式

JavaScript 原型模式

JavaScript原型模式

1. 普通物件

var o1 = {}
var o2 = new Object()
var o3 = new f1()

除了函式物件就是普通物件

2. 函式物件

function f1(){}
var f2 = function(){}
var f3 = new Function()

函式物件本質上都是通過new Function()創造的

JavaScript內建有12個構造器/物件

Number、Boolean、String、Object、Function、Array、RegExp、Error、Date、Global、Arguments、Math、JSON

Global不能直接訪問,Arguments僅在函式呼叫時由JS引擎建立,Math,JSON是以物件形式存在
的,無需new。它們的proto是Object.prototype

Inner.__proto__ === Function.prototype
Inner.constructor == Function

所有函式物件的__proto__都指向Function.prototype,它是一個空函式(Empty function)

f(){[native code]}

3. 建構函式

function Person(name, age, job) {
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function() { alert(this.name) } 
}
var p1 = new Person('Zaxlct', 28, 'Software Engineer');
var p2 = new Person('Mick', 23, 'Doctor');

p1、p2都是建構函式Person的例項,p1、P2的constructor屬性指向建構函式Person

4. 原型物件

每個物件都有__proto__屬性,但只有函式物件才有prototype屬性

// 建構函式
function Person() {}
Person.prototype.name = 'Zaxlct';
Person.prototype.age  = 28;
Person.prototype.job  = 'Software Engineer';
Person.prototype.sayName = function() {
  alert(this.name);
}

// 原型物件
Person.prototype = {
    name:  'Zaxlct',
    age: 28,
    job: 'Software Engineer',
    sayName: function() {
    alert(this.name);
    }
}

原型物件是一個普通物件,Person.prototype就是原型物件

var A = new Person();
 Person.prototype = A;

原型物件(Person.prototype)是建構函式(Person)的一個例項

5. __proto__

JS在建立物件(不論是普通物件還是函式物件)的時候,都有一個叫做__proto__ 的內建屬性,用於指向建立它的建構函式的原型物件

person1.__proto__ == Person.prototype

6. 構造器

建構函式(Object)本身就是一個函式(就是上面說的函式物件),它和上面的建構函式 Person 差不多。只不過該函式是出於建立新物件的目的而定義的。

7. 原型鏈

person1.__proto__ = Pserson.prototype
Person.__proto__ = Function.prototype
Person.prototype.__proto__ = Object.prototype
Object.__proto__ = Function.prototype
Object.prototype.__proto__ = null

8. prototype

Function.prototype是唯一一個typeof XXX.prototype為function的prototype,其它的構造器的prototype都是一個物件。

例項和原型物件存在一個連線,這個連線存在於例項與建構函式的原型物件之間,而不是存在於實與建構函式之間。