JS创建对象的方式:
下面的例子,我们都是new一个人的对象。这个对象有方法和属性。
对象字面量:
var person = {
name:'zhaobw',
age:23,
gender:'man',
run:function(){
console.log("我会跑步");
}
}
我们创建了一个person对象。调用对象的方法和属性如下操作:
console.log(person.name); //zhaobw
console.log(person.age); //23
console.log(person.gender); //man
person.run(); //我会跑步
缺点:特麻烦。为什么麻烦?
- 如果我要在创建一个name是Tom的对象,就要在重新写一个对象。而这两个对象,只有名字不同,而其他的都一样。这样就很浪费空间。所以这个方法不推荐使用。
利用内置对象来创建对象
var str = new String();
var obj = new Object();
obj.name = "zhaobw";
obj.age = "22";
obj.gender = "man";
obj.run = fnction(){
console.log("我会跑步");
}
缺点:还是麻烦。同上。
- 一般创建对象都用Object。很少用String这些。因为Object是一张干净的白纸。你想怎么写,就怎么写。然而String还自带一些方法。如果在写的时候,不小心覆盖了,就不好了。所以一般选用像白纸一样的Object,干净。
构造函数--工厂模式
function Person(name,age,gender){
var obj = new Object();
obj.name = name;
obj.age = age;
obj.gender = gender;
obj.run = function(){
console.log("我会跑步");
};
return obj;
}
缺点:没有语法new和想象的中的不一样。还有一个严重的问题就是函数不是共用的。举个例子:
var Tom = Person(tom,22,man);
var Zhaobw = Person(zhaobw,23,man);
- 首先我们这个方法解决了前面的问题。每次只需调用一次函数就可以得到一个对象。是不是很方便。
- Zhaobw.run() === Tom.run() // false。说明这连个两个对象的方法不相等。但是两个对象的方法内容是一模一样的。这明显在浪费存储空间。这样可不行。
构造函数 -- new
function person(name,age,gender){
this.name = name;
this.age = age;
this.gender =gender;
this.run = function(){
console.log("我会跑步");
}
}
var tom = new person("zhaobw",23,man);
缺点:函数还是不能共用。
- 我们解决new的问题了。这里new做了什么事啊?我会在下面详细说明的。
new这个操作做了这几步:
- 创建了一个空对象,作为this。
- this.proto指向构造函数的prototype
(proto和prototype会在单独详解,目前可以暂时不理解) - 运行构造函数
- 返回this.
new做的操作其实就是帮我们前面的创建对象的方法。少写了几步。这是来自JS之父的关爱。是不是很有爱。new的作用就是可以让我们少些几行代码。所以就是个语法糖。这都是前辈的关爱。
现在就剩下函数共用的问题没有解决了。来吧放大招了。
原型模式(名字很吓人,别怕)
function person(name,age,gender){
this.name = name;
this.age = age;
this.gender =gender
}
person.prototype.run = function(){
console.log("我会跑步");
}
这样就解决了函数共用的问题。和上面的写法的有什么区别?
就是多了个prototype--原型。关于原型我会单独写一章。这个很有用的。
好了。 共用的放在原型里,不一样的放够着函数里。
这篇文章从最初怎么创建对象,以及为什么这么创建一步步写下来了。希望对你有用。本文涉及了this、原型。这些概念我会在后面详细讲解。一起努力吧。