JavaScript-高级篇-构造函数(上篇)

93 阅读2分钟

「这是我参与2022首次更文挑战的第2天,活动详情查看:2022首次更文挑战」。

第2章 构造函数

定义:通过 new 函数名, 来实例化对象的函数叫构造函数。

任何的函数都可以作为构造函数存在。

之所以有构造函数与普通函数之分,主要从功能上进行区别的,构造函数的主要功能为初始化对象,特点是和new 一起使用。

new就是在创建对象,从无到有,构造函数就是在为初始化的对象添加属性和方法。

构造函数定义时首字母大写(规范)。

1. 构造函数的实例成员和静态成员

1.1 实例成员

实例成员就是在构造函数内部添加的成员,只能由实例化的对象来访问

function Person(name, age) {
    this.name = name;
    this.age = age;
    this.run = function () {
        console.log(this.name+'在奔跑');
    }
}

var p1 = new Person('张三', 20);  // 创建实例化对象
console.log(p1.name);  // 用实例化对象访问name属性
p1.run();  // 用实例化对象访问run方法
console.log(Person.name);  // 无法访问

1.2 静态成员

在构造函数本身上添加的成员,只能由构造函数本身来访问

function Person(name, age) {
    this.name = name;
    this.age = age;
    this.run = function () {
        console.log(this.name+'在奔跑');
    }
}

var p2 = new Person('李四', 24);  // 创建实例化对象
Person.sex = '男';  // 创建静态成员
console.log(Person.sex);  // '男'
console.log(p2.sex);  // undefined

2. 构造函数的原型prototype

function Person(name) {
    this.mName = name;
    this.sayName = function() {
        return this.mName;
    };
}

var p1 = new Person('张三');
var p2 = new Person('李四');

构造函数通过原型分配的函数是所有对象所共享的。

JavaScript 规定,每一个构造函数都有一个prototype 属性

  • prototype是一个对象属性,其属性值为对象,称为原型对象
  • 可以通过prototype来添加新的属性和方法,此时所有该构造函数创建的实例对象都会具有这些属性和方法
  • 由该构造函数创建的对象会默认链接到该属性上

语法

  • 构造函数.prototype.属性名 = 值;
  • 构造函数.prototype.方法名 = function(){定义方法体};

  我们可以把那些不变的方法,直接定义在 prototype 对象上,这样所有对象的实例就可以共享这些方法。

function Person(name) {
    this.mName = name;
    this.sayName = function() {
        return this.mName;
    };
}
Person.prototype.sayName = function() {
	console.log(this.mName);
    return this.mName;
}
var p1 = new Person('张三');
var p2 = new Person('李四');
 p1.sayName();
 p1.sayName();
 

总结:

  • prototype是一个对象属性,其属性值为对象,称为原型对象

  • 原型的作用是什么? 共享方法