js面向对象2

来源:互联网 发布:win7未知网络错误 编辑:程序博客网 时间:2024/06/06 02:22

创建对象几种方法
1.基于obj创建对象

var obj=new Object;   //创建了一个object对象    obj.name="校花";   //创建了一个name属性并赋值为校花;    obj.ago=110;    obj.info=function(){     //创建了一个info()方法(也可以看成一个匿名函数)          console.log(this.name+this.ago)  //this指向的就是obj对象    };   obj.info();    //调用方法(调用匿名函数)

缺点:创建类似的对象,要产生大量的代码;
2.采用对象字面量的方式;

 var obj= {        name: "校花",        ago: 110,        info: function (){            console.log(this.ago,this.ago);        }    };   obj.info();

3.工厂模式

      //缺点:实例指向不明确 function  abs(ago,name){        var obj={};        obj.ago=ago;        obj.name=name;        obj.info=function(){            console.log(this.ago,this.name);        };        return obj;    }    var per=abs(120,"校花");//per 就是abs函数的实例       console.log(per.name);//校花    console.log(per instanceof abs);  false    console.log(per instanceof Object);   trueinstanceof   用来检测当前对象是否为某一类的实例    工厂模式要有返回值 return   木有new字符

4.构造函数模式

function  abs(ago,name){       /*   this=new Object();*/        this.ago=ago;        this.name=name;        this.info=function(){            console.log(this.ago,this.name);        };      /* return this*/      }    var per1=new abs(120,"嘿嘿");    console.log(per1.name);//this指向的是per1    var per=new abs(120,"校花");//per 就是abs函数的实例    per.info();    构造函数和普通函数的不同处:    1。构造函数有new操作符;    2.木有return    返回值;    3.函数名首字母大写,书写规范;    4.this  指向的当前实例;    构造函数的缺点:    在创建多个实例时候,会重复调用new function创建多个实例;这些函数都不在同一个函数域里,会造成内存浪费;    会形成闭包,影响性能呢

关于this指向的几种情况
1.全局中调用
var box = 2;
alert(this.box); //全局,代表 window
2.函数调用
函数中的this也指向window对象
function greeting(){
this.name=”sheila”;
alert(“hello “+this.name);
}
greeting();//hello sheila
alert(window.name);//sheila
3.对象的方法调用
obj.fn();//obj对象的fn()方法中的this指向obj
4.调用构造函数
var dog=new Dog();//构造函数内的this指向新创建的实例对象

5.原型模式(利用构造函数的prototype属性)
我们创建的每个函数都有一个 prototype(原型)属性,这个属性是一个对象,它的用途是包含可以由特定类型的所有实例共享的属性和方法。
使用原型的好处可以让所有对象实例共享它所包含的属性和方法。也就是说,不必在构造函数中定义对象信息,而是可以直接将这些信息添加到原型中。具有共享性;

 function  abs(){    }      //构造函数    abs.prototype.ago=110; //在原型添加属性    abs.prototype.name="嘿嘿";    abs.prototype.info=function(){   //在原型中添加方法(函数)        console.log(this.ago,this.name)    };   var per=new abs();    per.info()    //  var per={};    //   per.__proto__===abs.prototype;    //   abs.call(per);    //   per.info  //abs.prototype.info    console.log(per.__proto__===abs.prototype);//构造函数的原型对象=实例的__proto__   true     缺点:1具有共享性,把原型对象里面的属性都会赋值给每个实例,   2.不能给原型对象的属性绑定参数

6.使用原型模式和构造函数相结合;
构造函数:加属性;
原型:函数(方法)

function Person(name,age){        this.name=name;        this.age=age;        this.family=['老爸','老妈'];    }    Person.prototype={        constructor:Person,        info:function(){            console.log(this.family);        }    };    var per = new Person('花花',18);    per.family.push('哥哥');    per.info();

继承:
1.现在让一个对象的原型等于另一个对象的实例,那么这个对象就继承了另一个对象的所有属性和方法,而这个对象的所有实例都共享这个对象的原型里面的所有属性及方法。

function  Abs(name){        this.name=name;  //父类    }    Abs.prototype.info=function(){        console.log(this.name);       //父类函数的原型对象    };    function X(ago){      //子类        this.ago=ago;    }    var per=new  Abs("校花");    X.prototype=per;     //将父类函数的实例赋值给子类函数的原型对象;子类函数就继承了父类函数的属性和方法   var per1= new X(21);   //子类函数的实例    per1.info();      //实例调用函数;校花

2.构造继承

  function  Abs(name){        this.name=name;    }    Abs.prototype.info=function(){        console.log(this.name);    };    function X(ago,name){        this.temp=Abs;   //引入一个临时值用来保存Abs(将Abs保存在this.temp这个属性里面)        this.temp(name);//调用属性  就继承在这个子类函数里面了;        delete this.temp;        this.ago=ago;    }   var per1= new X(21,'校花');      console.log(per1.name); //校花

3.apply 和call 方法;

 function  Abs(name){        this.name=name;    }    Abs.prototype.info=function(){        console.log(this.name);    };    function X(ago,name){        Abs.call(this,name);//父类.call(this,父类的属性)        this.ago=ago;    }   var per1= new X(21,'校花');      console.log(per1.name);
 function  Abs(name){        this.name=name;    }    Abs.prototype.info=function(){        console.log(this.name);    };    function X(ago,name){        Abs.apply(this,[name]);//apply:父类的属性要用数组抱着 this指的是子类的实例  (this,arguments) 所有的参数        this.ago=ago;      }   var per1= new X(21,'校花');      console.log(per1.name);

延伸:

var arr=[1,2,3];    arr.push(3);    console.log(arr);    Array.prototype.push.apply(arr,[2,3]);//apply 数组    console.log(arr);    Array.prototype.push.call(arr,2,3,4); //2,2,2    console.log(arr);
 //让一个null有长度为10的特性    Array.apply(null,{length:10}).forEach(function(item,index){        console.log(index);    });
原创粉丝点击