创建对象的方式
- json对象方式创建对象
var point = {x:10,y:10,show:function(){
console.log(this.x+','+this.y);
}};
// 优点:方便,用于接受和存储临时数据
// 缺点: 不方便扩展
- Object方式
var point = new Object();
point.x = 10;
point['y'] = 10;
point['show'] = function () {
console.log(this.x+','+this.y);
};
point.show();
// 同样不方便扩展
- 声明构造函数方式,创建对象
function Point(x,y){
this.x = x;
this.y = y;
this.show = function () {
console.log(this.x+','+this.y);
};
}
var point = new Point(20,20);
point.show();
var point1 = new Point(30,30);
point1.show();
// 方便扩展,并且可以多次使用Point创建多个对象
//对象中的方法尽量都放到原型对象中
function Point(x,y){
this.x = x;
this.y = y;
this.show = function () {
console.log(this.x+','+this.y);
};
}
var point = new Point(20,20);
point.show();
var point1 = new Point(30,30);
point1.show();
// 这样可以把按同一构造函数创建的对象的show方法都只想同一内存地区,如果对象过多,减少了必要的内存
—
- 这种创建对象的方式用着不是很爽,需要按特定的顺序传参,不是很灵活
function Person(name,age,sex){
this.name = name;
this.age = age;
this.sex = sex;
}
Person.prototype.show = function(){
console.log(this.name,this.age,this.sex);
};
var p = new Person('xiaoming',18,'boy');
p.show();
// 这种创建对象的方式用着不是很爽,需要按特定的顺序传参,不是很灵活
- 把传参方式换成传入对象的方式
function Person(obj){
this.name = obj.name || '';
this.age = obj.age || 0;
this.sex = obj.sex || 'girl';
}
Person.prototype.show = function(){
console.log(this.name,this.age,this.sex);
};
var p = new Person({name:'xiaoming',
sex:'girl',
age:18
});
p.show();
new一个对象经过的过程如下:
- 第一步: 在内存中开辟一个新空间,创建一个空对象
- 第二步: 把this指向这个空对象
- 第三步: 把空对象的内部原型指向构造函数的原型对象
- 第四步: 当构造函数执行完成后,如果没有return,就把当前空对象返回
代码模拟此过程
function Point(x,y){
// 第一步:在内存中开辟一个新空间,创建一个空对象
var kong = {};
// 第二步:this指向空对象,(使用_this模拟this)
_this = kong;
// 第三步:空对象的内部原型指向构造函数的原型对象
_this.__proto__ = Point.prototype;
_this.x = x;
_this.y = y;
// _this.show = function(){
// console.log(this.x +','+this.y);// 此时this指向_this对象,即kong
// };
// 第四步:如果没有return,就返回空对象,此处为了模拟返回该对象,就添加了return
return _this;
}
Point.prototype.show = function(){
console.log(this.x +','+this.y);
};
var point = new Point(20,20);
point.show();
var point1 = new Point(30,30);
point1.show();