码迷,mamicode.com
首页 > Web开发 > 详细

JS面向对象的学习

时间:2015-12-05 22:22:45      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:

1、面向对象

var arr = new Array();    //[] //我们把系统自带的对象,叫做系统对象



var arr = [];  
arr.number = 10;        //对象下面的变量:叫做对象的属性
arr.test = function(){  //对象下面的函数 : 叫做对象的方法
    alert(123);
};

 

2、面向对象的转变

var obj = new Object();  //创建了一个空的对象
obj.name = 小明;  //属性
obj.showName = function(){  //方法
    alert(this.name);
};

obj.showName();


var obj2 = new Object();  //创建了一个空的对象
obj2.name = 小强;  //属性
obj2.showName = function(){  //方法
    alert(this.name);   //函数中的this指的是什么,一般是看函数调用时,函数前面的东西,若无则指的是window,若像下面obj2.showName();则指的是obj2
}; 
obj2.showName();
//工厂方式 : 封装函数

function createPerson(name){
    
    //1.原料
    var obj = new Object();
    //2.加工
    obj.name = name;
    obj.showName = function(){
        alert( this.name );  
    };
    //3.出场
    return obj;
    
}

var p1 = createPerson(小明);
p1.showName();
var p2 = createPerson(小强);
p2.showName();
//当new去调用一个函数 : 这个时候函数中的this就是创建出来的对象,而且函数的的返回值直接就是this啦(隐式返回)

//new后面调用的函数 : 叫做构造函数

function CreatePerson(name){ this.name = name; this.showName = function(){ alert( this.name ); }; } var p1 = new CreatePerson(小明); //p1.showName(); var p2 = new CreatePerson(小强); //p2.showName(); alert( p1.showName == p2.showName ); //false var arr = new Array(); var date = new Date();

 

3、上面就提到了

p1.showName == p2.showName 为何是false。其原因是,地址引用不同。所以就引出来原型。

//原型 : 去改写对象下面公用的方法或者属性 , 让公用的方法或者属性在内存中存在一份 ( 提高性能 )

//原型 : CSS中的class
//普通方法 : CSS中的style

//原型 : prototype : 要写在构造函数的下面

/*var arr = [1,2,3,4,5];
var arr2 = [2,2,2,2,2];

arr.sum = function(){
    
    var result = 0;
    for(var i=0;i<this.length;i++){
        result += this[i];
    }
    return result;
    
};
arr2.sum = function(){
    
    var result = 0;
    for(var i=0;i<this.length;i++){
        result += this[i];
    }
    return result;
    
};

//alert( arr.sum() );  //15
//alert( arr2.sum() );  //10*/

var arr = [1,2,3,4,5];
var arr2 = [2,2,2,2,2];

Array.prototype.sum = function(){
    var result = 0;
    for(var i=0;i<this.length;i++){
        result += this[i];
    }
    return result;
};

alert( arr.sum() );  //15
alert( arr2.sum() );  //10

 然后返回到上面小明小强的例子,

p1.showName == p2.showName 是false  ,如何变成true
//当new去调用一个函数 : 这个时候函数中的this就是创建出来的对象,而且函数的的返回值直接就是this啦(隐式返回)

//new后面调用的函数 : 叫做构造函数

function CreatePerson(name){
    
    this.name = name;
    
}
CreatePerson.prototype.showName = function(){
    alert( this.name );
};

var p1 = new CreatePerson(小明);
//p1.showName();
var p2 = new CreatePerson(小强);
//p2.showName();

alert( p1.showName == p2.showName );  //true

var arr = new Array();
var date = new Date();

 



 

JS面向对象的学习

标签:

原文地址:http://www.cnblogs.com/wanliyuan/p/5022274.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!