持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第12天,点击查看活动详情
创建对象的方式
字面量创建对象
- 如果要创建大量的字面量对象, 则需要编写大量的代码
- 在创建相同的字面量对象时, 不可以保证所有手写的属性都是正确的, 一致的
- 每个对象都存在大量相同的方法, 占用大量空间
- 要修改或删除某个方法时, 必须在每个对象身上进行修改或删除, 不利于统一管理
构造函数创建对象
- 使用关键字new来调用构造函数
- 函数内部首先会创建一个空对象, 并且将对象引用赋值给this
- 通过this初始化对象中的属性和方法
- 将this作为返回值返回
注意事项
- 使用字面量创建对象, 在属性名上可能会犯无法预知的错误, 如user1和user2中的属性
- 使用字面量创建对象, 在使用console.log输出时, 为Object对象
- 使用构造函数创建对象, 在使用console.log输出时, 为构造函数名的对象, 如 User
// 字面量
let user1 = {
name: 'shaosiming',
age: 16
}
let user2 = {
nmae: 'dasiming',
aeg: 18
}
// 构造函数
function User(name, age) {
console.log(this);
this.name = name;
this.age = age;
}
let user3 = new User('tianming', 10);
let user4 = new User('yuer', 8);
console.log(user3);
console.log(user4);
构造函数 - 接收多个参数
当形参少时尚可使用, 如果形参很多的时候, 不但要注意形能的数量, 不要注意形参的顺序
否则会带来意想不到的bug
// 构造函数
function User(name, age) {
// console.log(this);
this.name = name;
this.age = age;
}
let user3 = new User('tianming', 10);
let user4 = new User('yuer', 8);
构造函数 - 接收一个参数
当构造函数的形参很多时, 我们就可以考虑使用字面量对象来传递给构造函数
而构造函数也可以使用一个形参来接收这个字面量对象
这样就可以完美解决形参多时的顺序问题, 当然数量问题只能开发人员来注意了
// 构造函数接收多个参数
function Person1(name, age, gender, hobby, isNice) {
this.name = name;
this.age = age;
this.gender = gender;
this.hobby = hobby;
this.isNice = isNice;
}
// 构造函数接收一个字面量对象
function Person2(params) {
this.name = params.name;
this.age = params.age;
this.gender = params.gender;
this.hobby = params.hobby;
this.isNice = params.isNice;
}
let p1 = new Person1('shaosiming', 16, 'female', 'da tianming', true);
let p2 = new Person2({
name: 'dasiming',
age: 18,
gender: 'female',
hobby: 'da tianming',
isNice: true
});
typeof
使用typeof来进行类型的判断, 只会返回boolean, number, string, undefined, object
instanceof
使用instanceof可以判断一个值是不是某个构造函数构造出来的实例
注意: 对于一个对象来说, 不管是添加一个属性, 还是删除一个属性, 它还是某个构造函数的实例
user3.hobby = 'da tianming' // 添加属性
delete user4.age; // 删除属性
console.log(user3);
console.log(user4);
console.log(typeof(user3)); // Object
console.log(user3.constructor.name); // User
console.log(user3 instanceof User); // true
console.log(user3 instanceof Object); // true