抱歉，您的浏览器无法访问本站

本页面需要浏览器支持（启用）JavaScript


了解详情 >

在看本文之前，我们可以先复习上一篇文章：《03-JavaScript基础/12-对象的创建&构造函数.md》

原型对象

原型的引入

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function Person(name, age, gender) {
    this.name = name;
    this.age = age;
    this.gender = gender;
    //向对象中添加一个方法
    this.sayName = function () {
        console.log("我是" + this.name);
    }
}

//创建一个Person的实例
var per = new Person("孙悟空", 18, "男");
var per2 = new Person("猪八戒", 28, "男");
per.sayName();
per2.sayName();

console.log(per.sayName == per2.sayName);  //打印结果为false

分析如下：

上方代码中，我们的sayName方法是写在构造函数 Person 内部的，然后在两个实例中进行了调用。造成的结果是，构造函数每执行一次，就会给每个实例创建一个新的 sayName 方法。也就是说，每个实例的sayName都是唯一的。因此，最后一行代码的打印结果为false。

按照上面这种写法，假设创建10000个对象实例，就会创建10000个 sayName 方法。这种写法肯定是不合适的。我们为何不让所有的对象共享同一个方法呢？

还有一种方式是，将sayName方法在全局作用域中定义：（不建议。原因看注释）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function Person(name, age, gender) {
    this.name = name;
    this.age = age;
    this.gender = gender;
    //向对象中添加一个方法
    this.sayName = fun;
}

//将sayName方法在全局作用域中定义
/*
 * 将函数定义在全局作用域，污染了全局作用域的命名空间
 *  而且定义在全局作用域中也很不安全
 */
function fun() {
    alert("Hello大家好，我是:" + this.name);
};

比较好的方式是，在原型中添加sayName方法：

1
2
3
Person.prototype.sayName = function(){
    alert("Hello大家好，我是:"+