在Javascript的ES5中,我们目前可以采用几种方式创建对象(object):
1、利用对象字面量创建对象
2、利用new Object() 创建对象
3、利用 构造函数创建对象
1. 利用字面量创建对象
对象字面量:就是花括号{ }里面包含了表达这个具体事物(对象)的属性和方法。var obj ={ };
{ }里面采用键值对的形式表示
键: 相当于属性名
值: 相当于属性值,可以是任意类型的值(数字类型、字符串类型、布尔类型、函数类型)\
var obj = new Object();
obj.uname = '周杰伦';
obj.singSong = function () {
console.log('青花瓷');
}
console.log(obj.uname);// 周杰伦
obj.singSong();// 青花瓷
(1)对象的属性值或者方法我们采取键值对的形式 键 属性名 : 值 属性值\
(2)多个属性或者方法中间用逗号隔开\
(3)方法冒号后面跟的是一个匿名函数
这种方式死板, 灵活度不高, 每次都需要手动创建, 冗余度也很大, 适用于临时对象变量或者局部属性少的对象
2. 利用 对象字面量创建对象
var obj = {
uname: '周杰伦',
singSong: function () {
console.log('青花瓷');
}
}
console.log(obj.uname);// 周杰伦
obj.singSong();// 青花瓷
对象字面量是对象定义的一种简写形式,第一种和第二种创建形式的缺点就是:他们用同一个接口创建很多对象和,会产生大量的重复代码,如果你有500个对象,那么你就要输入500次很多相同的代码。
3. 利用构造函数创建对象
function Star(uname, age) {
// 属性
this.uname = uname;
this.age = age;
// 方法
this.sing = function () {
console.log('青花瓷');
}
}
var ldh = new Star('周杰伦,25')
console.log(ldh);
ldh.sing();
构造函数执行的流程:
1 创建一个新的对象(遇到new 的时候)
2 将构造函数的作用域赋给新的对象(因此this就指向这个对象)
3 执行构造函数中的代码(为这个对象添加属性)
4 返回新对象
那么构造函数确实挺好用的,但是它也有它的缺点:
每个对象里面都有公用的函数,意味着每次创建都会穿件这个函数,因此可以这个函数放到外面,但是会污染全局作用域。
就是每个方法都要在每个实例上重新创建一遍,方法指的就是我们在对象里面定义的函数。如果方法的数量很多,就会占用很多不必要的内存。
\
4.es6新增类创建对象
class Star {
// 属性
constructor(uname, age) {
this.uname = uname;
this.age = age;
}
// 方法
sing(song) {
console.log(song);
}
}
var ldh = new Star('周杰伦', 25);
console.log(ldh);
ldh.sing('青花瓷');