在JavaScript中,构造函数用于创建对象。例如,
// constructor function
function Person () {
this.name = 'John',
this.age = 23
}
// create an object
let person = new Person();
在上面的示例中, function Person()
是对象构造函数。
要从构造函数创建对象,我们使用new
关键字。
注意 :最好将构造函数的首字母大写。
使用构造函数创建多个对象
在JavaScript中,您可以通过构造函数创建多个对象。例如,
// constructor function
function Person () {
this.name = 'John',
this.age = 23,
this.greet = function () {
console.log('hello');
}
}
// create objects
let person1 = new Person();
let person2 = new Person();
// access properties
console.log(person1.name); // John
console.log(person2.name); // John
在以上程序中,使用相同的构造函数创建了两个对象。
JavaScript这个关键字
在JavaScript中,当this
关键字在一个构造函数被使用, this
指的是对象被创建对象时。例如,
// constructor function
function Person () {
this.name = 'John',
}
// create object
let person1 = new Person();
// access properties
console.log(person1.name); // John
因此,当对象访问属性时,它可以作为person1.name
直接访问属性。
JavaScript构造函数参数
您还可以使用参数创建构造函数 。例如,
// constructor function
function Person (person_name, person_age, person_gender) {
// assigning parameter values to the calling object
this.name = person_name,
this.age = person_age,
this.gender = person_gender,
this.greet = function () {
return ('Hi' + ' ' + this.name);
}
}
// creating objects
let person1 = new Person('John', 23, 'male');
let person2 = new Person('Sam', 25, 'female');
// accessing properties
console.log(person1.name); // "John"
console.log(person2.name); // "Sam"
在上面的示例中,我们在对象创建期间将参数传递给了构造函数 。
let person1 = new Person('John', 23, 'male');
let person2 = new Person('Sam', 25, 'male');
这允许每个对象具有不同的属性。如上图所示
console.log(person1.name);
给约翰
console.log(person2.name);
给山姆
创建对象:构造函数与对象字面量
- 对象字面量通常用于创建单个对象。如果要创建多个对象,则构造函数非常有用。例如,
// using object literal
let person = {
name: 'Sam'
}
// using constructor function
function Person () {
this.name = 'Sam'
}
let person1 = new Person();
let person2 = new Person();
- 从构造函数创建的每个对象都是唯一的。您可以具有与构造函数相同的属性,也可以向一个特定对象添加新属性。例如,
// using constructor function
function Person () {
this.name = 'Sam'
}
let person1 = new Person();
let person2 = new Person();
// adding new property to person1
person1.age = 20;
现在,此age
属性对于person1
对象是唯一的, person1
用于person2
对象。
但是,如果使用对象字面量创建对象,并且使用该对象值定义了变量,则变量值的任何更改都会更改原始对象。例如,
// using object lateral
let person = {
name: 'Sam'
}
console.log(person.name); // Sam
let student = person;
// changes the property of an object
student.name = 'John';
// changes the origins object property
console.log(person.name); // John
用对象字面量创建对象时,从该对象派生的任何对象变量都将充当原始对象的克隆。因此,您对一个对象所做的任何更改也将反映在另一对象上。
在对象中添加属性和方法
您可以在这样的对象中添加属性或方法:
// constructor function
function Person () {
this.name = 'John',
this.age = 23
}
// creating objects
let person1 = new Person();
let person2 = new Person();
// adding property to person1 object
person1.gender = 'male';
// adding method to person1 object
person1.greet = function () {
console.log('hello');
}
person1.greet(); // hello
// Error code
// person2 doesn't have greet() method
person2.greet();
输出
hello
Uncaught TypeError: person2.greet is not a function
在上面的示例中,将新的属性gender
和新的方法greet()
添加到person1
对象。
但是,此新属性和方法仅添加到object1
。您无法从object2
访问gender
或greet()
。因此,当我们尝试访问person2.greet();
时,该程序给出了错误person2.greet();
JavaScript对象原型
您还可以使用原型向构造函数添加属性和方法。例如,
// constructor function
function Person () {
this.name = 'John',
this.age = 23
}
// creating objects
let person1 = new Person();
let person2 = new Person();
// adding new property to constructor function
Person.prototype.gender = 'Male';
console.log(person1.gender); // Male
console.log(person2.gender); // Male
要了解有关原型的更多信息,请访问JavaScript Prototype 。
JavaScript内置构造函数
JavaScript还具有内置的构造函数。他们之中有一些是:
let a = new Object(); // A new Object object
let b = new String(); // A new String object
let c = new Number(); // A new Number object
let d = new Boolean(); // A new Boolean object
在JavaScript中,可以通过以下方式将字符串创建为对象:
let name = new String ('John');
console.log(name); // "John"
在JavaScript中,可以通过以下方式将数字创建为对象:
let number = new Number (57);
console.log(number); // 57
在JavaScript中,可以通过以下方式将布尔值创建为对象:
let count = new Boolean(true);
console.log(count); // true
注意 :建议使用原始数据类型并以常规方式创建它们,例如let name = 'John';
, let number = 57;
并let count = true;
您不应将字符串,数字和布尔值声明为对象,因为它们会使程序变慢。
注意 :在JavaScript中,关键字class
是ES6(ES2015)中引入的,它也允许我们创建对象。类类似于JavaScript中的构造函数。要了解更多信息,请访问JavaScript类 。