java 有 class 和 instance,js 仅仅有构造函数(function Cat(name,age){this.name=name;this.age=age}), 为了实现数据共享和抽象出通用的属性,加了一个原型 prototype
eg:
function Cat(name,age){
this.name = name;// 这里的 this 相当于 java 里面的 instance
this.age = age;
this.work = function(){
alert("I am working");
}
}
var cat1 = new Cat("cat1",13);
var cat2 = new Cat("cat2",15);
cat1 和 cat2 的都有 work 属性,可是一样的属性,明显是多余的,造成浪费。能够抽象出原型出来
function Dog(name,age){
this.name = name;
this.age = age;
}
Dog.prototype = {work:function(){alert("I am working!")}} 或者
Dog.prototype.work = function(){
alert("I am working");
}
2. 封装:
原始模式:var cat = {};cat.name ="cat1";cat.id ="id1";
原始模式改进:var cat = function cat(name,id){return {name:name,id:id}},相当于调用函数
构造函数模式:function(name,id){this.name = name;this.id=id}
js 中构造函数在初始化的时候加 new 和不加 new 的差别
function Dog(name,age){
this.name = name;
this.age = age;
}
Dog.prototype = {work:function(){alert("I am working!")}}
var dog1 = Dog("dog1",12);// 这仅仅是相当于调用普通函数。原型 work 不会生成,调用 work 属性会报错
var dog2 = new Dog("dog2",13);// 这里是调用构造函数,初始化原型 work
var dog3 = new Dog("dog3",14);
dog2.constructor == Dog; dog3.constructor == Dog
为了解决从原型对象生成实例的问题,Javascript 提供了一个构造函数(Constructor)模式。
所谓 "构造函数",事实上就是一个普通函数,可是内部使用了 this 变量。对构造函数使用 new 运算符,就能生成实例。而且 this 变量会绑定在实例对象上。
3. 继承
(1)对象冒充
- function ClassA(sColor) {
- this.color = sColor;
- this.sayColor = function () {
- alert(this.color);
- };
- }
- function ClassB(sColor) {
- }
- function ClassB(sColor) {
- this.newMethod = ClassA;
- this.newMethod(sColor);
- delete this.newMethod;
- }
在这段代码中,为 ClassA 赋予了方法 newMethod(请记住。函数名仅仅是指向它的指针)。然后调用该方法。传递给它的是 ClassB 构造函数的參数 sColor。最后一行代码删除了对 ClassA 的引用,这样以后就不能再调用它。
全部新属性和新方法都必须在删除了新方法的代码行后定义。否则。可能会覆盖超类的相关属性和方法:
- function ClassB(sColor, sName) {
- this.newMethod = ClassA;
- this.newMethod(sColor);
- delete this.newMethod;
- this.name = sName;
- this.sayName = function() {
- alert(this.name);
- };
- }
- var objA = new ClassA("blue");
- var objB = new ClassB("red", "John");
- objA.sayColor(); //输出 "blue"
- objB.sayColor(); //输出 "red"
- objB.sayName(); //输出 "John"
来源: http://www.bubuko.com/infodetail-2252325.html