那么让我们来详细讲解一下“JS面向对象编程基础篇(一) 对象和构造函数实例详解”的完整攻略。
对象是 JavaScript 中一种复合数据类型,由属性和方法组成,用于存储和操作数据。可以通过对象字面量或构造函数来创建。
构造函数是创建对象的一种特殊方式。它是一种函数,当用 new
关键字调用时,它将返回一个新的对象,并通过原型继承关联到构造函数的 prototype
属性。特别地,如果构造函数没有 return
语句,或者返回的不是一个对象类型,那么 new
关键字返回的对象就是这个构造函数创建的对象本身。
下面是一个创建对象的示例:
const person = {
name: '张三',
age: 18,
sayHello() {
console.log(`大家好,我是${this.name}`);
}
};
上面的代码中,person
是一个对象,它有两个属性 name
和 age
,以及一个方法 sayHello
。 this
关键字引用了当前的对象,所以当 sayHello
方法被调用时,this.name
将返回 person.name
的值。
下面是一个使用构造函数创建对象的示例:
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHello = function() {
console.log(`大家好,我是${this.name}`);
}
}
const person = new Person('张三', 18);
上面的代码中,我们定义了一个 Person
构造函数,创建了一个 person
对象,并将其赋值给了变量 person
。这个对象有两个属性 name
和 age
,以及一个方法 sayHello
,其实现方式与前面例子中创建的对象的方法相同。但是与字面量方式不同的是,这个方法是通过 Person
构造函数的实例创建的。
对象可以有一些内置的方法来访问或修改它的属性,例如:
const person = {
name: '张三',
age: 18,
sayHello() {
console.log(`大家好,我是${this.name}`);
}
};
// 使用点语法访问对象属性
console.log(person.name); // 输出:"张三"
// 使用方括号语法访问对象属性
console.log(person['age']); // 输出:18
// 修改对象属性
person.age = 20;
console.log(person.age); // 输出:20
// 调用对象方法
person.sayHello(); // 输出:"大家好,我是张三"
构造函数在创建实例时,可以使用 this
关键字来引用实例对象。在构造函数中为实例对象添加属性和方法时,直接使用 this
就可以了。下面的示例展示了如何使用构造函数来创建对象,并访问和修改它们的属性:
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHello = function() {
console.log(`大家好,我是${this.name}`);
}
}
const person1 = new Person('张三', 18);
const person2 = new Person('李四', 20);
// 访问实例的属性
console.log(person1.name); // 输出:"张三"
console.log(person1.age); // 输出:18
// 修改实例的属性
person1.age = 22;
console.log(person1.age); // 输出:22
// 调用实例的方法
person1.sayHello(); // 输出:"大家好,我是张三"
示例1:使用对象字面量创建对象
下面的示例展示了如何使用对象字面量来创建一个 person
对象,包括添加属性和方法,并访问和修改它们:
const person = {
name: '张三',
age: 18,
sayHello() {
console.log(`大家好,我是${this.name}`);
}
};
console.log(person.name); // 输出:"张三"
console.log(person.age); // 输出:18
person.age = 20;
console.log(person.age); // 输出:20
person.sayHello(); // 输出:"大家好,我是张三"
示例2:使用构造函数创建对象
下面的示例展示了如何使用 Person
构造函数来创建一个 person
对象,包括添加属性和方法,并访问和修改它们:
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHello = function() {
console.log(`大家好,我是${this.name}`);
}
}
const person = new Person('张三', 18);
console.log(person.name); // 输出:"张三"
console.log(person.age); // 输出:18
person.age = 20;
console.log(person.age); // 输出:20
person.sayHello(); // 输出:"大家好,我是张三"
以上就是关于“JS面向对象编程基础篇(一) 对象和构造函数实例详解”的完整攻略,希望对你有所帮助。
本文链接:http://task.lmcjl.com/news/10617.html