JavaScript中的原型和对象机制

时间:2023-03-08 21:48:27
JavaScript中的原型和对象机制

1、对象相关的一些语言特性

JavaScript里所有的东西都是对象, 对象是属性的集合。要知道,函数也是对象, 能够作为变量的值、 返回值、 参数或者属性的值。 函数对象特殊的地方是能通过"xxx()"语法执行包含在xxx函数对象内的代码。

2、对象的属性可以动态添加和删除

var foo = new Object();

// 为foo对象添加bar属性

foo.bar = "foobar";

alert(foo.bar); //foobar

// 删除foo对象的bar属性

delete foo.bar;

alert(foo.bar); //undefined

3、创建对象

JavaScript对每个创建的对象都会设置一个原型,指向它的原型对象。例如,创建一个Array对象:

var arr = [1, 2, 3];

其原型链是:

arr ----> Array.prototype ----> Object.prototype ----> null

当我们创建一个函数时:

function foo() {

return 0;

}

函数也是一个对象,它的原型链是:

foo ----> Function.prototype ----> Object.prototype ----> null

4、构造函数创建对象

先定义一个构造函数:

function Student(name) {

this.name = name;

this.hello = function () {

alert('Hello, ' + this.name + '!');

}

}

上面的函数就是一个普通的函数,但是在JavaScript中,用关键字new来调用这个函数,他就是构造函数:

var xiaoming = new Student('小明');

xiaoming.name; // '小明'

xiaoming.hello(); // Hello, 小明!

JavaScript的对象是由构造函数创建的, 每个对象都有constructor属性表示创建该对象的构造函数:

function Test() { this.a = "hello"; }

var test = new Test(); // 由Test构造函数创建

alert(test.constructor);

alert: function Test() { this.a = "hello"; }

构造函数也是对象, 构造函数是由内建的Function函数创建的:

function Test(a, b)

{

alert(a+b);

}

// 相当于:

Test = new Function(["a", "b"], "alert(a+b);");

Function是本机代码实现的固有对象. 不过为了一致性, Function也有constructor属性, 该属性指向它自己。

5、原型prototype

prototype是构造函数的一个属性, 该属性指向一个对象. 而这个对象将作为该构造函数所创建的所有实例的基引用(base reference), 当我们用obj.xxx访问一个对象的属性时,JavaScript引擎先在当前对象上查找该属性,如果没有找到,就到其原型对象上找,如果还没有找到,就一直上溯到Object.prototype对象,最后,如果还没有找到,就只能返回undefined。

/ prototype默认为new Object(); 为了方便, 记为p_obj

function Person(name) {

this.name = name;

}

// 为 p_obj 增加 sayName 属性

Person.prototype.sayName = function(){

alert(this.name);

}

var john = new Person("John"); // john 的 base reference指向p_obj

var eric = new Person("Eric");  // eric 的 base reference也是指向p_obj

// 注意sayName代码中的this将指向实例化后的对象(this绑定)

john.sayName(); // john对象本身没有sayName属性, 于是访问原型对象p_obj    的sayName属性

eric.sayName(); // 访问同一个原型对象p_obj的sayName属性