第一种,Object构造函数模式
- 方法:先创建空Object对象,再动态添加属性和方法。
- 适用场景:初始时不确定对象内部数据。
- 问题:创建语句太多。
<script type="text/javascript">
var p = new Object();
console.log(p);
p.name = '张三';
p.age = 12;
p.setName = function (name) {
this.name = name;
};
console.log(p.name, p.age);
p.setName('李四');
console.log(p.name, p.age);
</script>
第二种,对象字面量
- 方法:使用
{ }
创建对象,同时指定属性和方法。
- 适用场景:初始时对象内部数据的确定的。
- 问题:如果创建多个对象,会有重复代码。
<script type="text/javascript">
var p = {
name: '张三',
age: 12,
setName: function (name) {
this.name = name;
}
};
console.log(p.name, p.age);
p.setName('李四');
console.log(p.name, p.age);
var p2 = {
name: '王五',
age: 15,
setName: function (name) {
this.name = name;
}
}
</script>
第三种,工厂模式
- 方法:通过工厂函数动态创建对象并返回创建成功的对象。
- 适用场景:需要创建多个对象。
- 问题:对象没有一个具体的类型,都是Object类型的。
<script type="text/javascript">
function createPerson(name, age) {
var obj = {
name: name,
age: age,
setName: function (name) {
this.name = name;
}
};
return obj;
}
var p1 = createPerson('张三', 12);
var p2 = createPerson('李四', 15);
function createFood(name, price) {
var obj = {
name: name,
price: price
};
return obj;
}
var f1 = createFood('西红柿', 3.5);
</script>
第四种,自定义构造函数模式
- 方法:自定义构造函数,通过
new
关键字来创建对象。
- 适用对象:需要创建多个类型确定的对象。
- 问题:每个对象都有相同的数据,浪费内存。
<script type="text/javascript">
function Person(name, age) {
this.name = name;
this.age = age;
this.setName = function (name) {
this.name = name;
}
}
var p1 = new Person('张三', 12);
p1.setName('李四');
console.log(p1.name, p1.age);
var p2 = new Person('王五', 13);
function Food(name, price) {
this.name = name;
this.price = price;
}
var f1 = new Food('西红柿', 3.5);
console.log(f1.name, f1.price);
console.log(p1 instanceof Person);
console.log(f1 instanceof Food);
</script>
第五种,构造函数与原型组合的模式
- 方法:自定义构造函数,属性在构造函数中初始化,而方法通过原型来进行添加。
- 适用场景:需要创建多个类型确定的对象。
<script type="text/javascript">
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.setName = function (name) {
this.name = name;
};
var p1 = new Person('张三', 14);
var p2 = new Person('李四', 15);
console.log(p1, p2);
</script>