一个最基本的面向对象写法:
function Aaa(){ //创建一个构造函数
this.name = '小明'; //添加属性
}
Aaa.prototype.showName = function(){ //添加方法
alert( this.name );
};
var a1 = new Aaa(); //通过new构造函数,创建一个对象,此对象拥有构造函数的方法和属性
a1.showName(); //调用属性/方法
那么编写面向对象的目的是什么?为了能够像系统对象如Array、Date的形式添加方法:
var arr=new Array();
arr.push();
arr.sort();
可以发现系统对象和面向对象使用形式非常类似,对象拥有其属性及方法。其实JS源码中,系统对象也是基于原型的程序。例如在JS源码中的Array是这样设计的:
function Array(){
this.length=0;
}
Array.prototype.push=function(){};
Array.prototype.sort=function() {};
由此自己编写的时候不要去修改系统自带的方法,会覆盖原有方法,例如:
var arr=[1,2,3];
Array.prototype.push=function(){}; //push方法为空
arr.push(4,5,6) //push方法失效
push方法在JS源码中是如何做到的呢:
Array.prototype.push=function(){
//this : 1,2,3; this为数组本身。arguments : 4,5,6 实参 。目标是让4,5,6添加到this后面
for(var i=0;i<arguments.length;i++){
this[this.length]=arguments[i];
}
return this.length //push方法返回值为arr.length
};
既然JS是基于原型的的,举个很普通的例子:
字符串方法:
var str="hello";
str.charAt(0);
str.indexOf("e");
显然 alert(typeof str);弹出结果是String(基本数据类型)。那么疑问产生,只有对象才能拥有方法,既然str是基本类型,那么他是怎么拥有方法的呢?这就涉及到了包装对象
包装对象:基本类型String、boolen、Number都有自己对应的包装对象
var str=new String("创建了一个基本类型的包装对象");
alert(typeof str) // Object 创建了一个字符串类型的包装对象,此时str为一个对象
上文中可以看到JS方法是写在构造函数的原型下,继续引用上文例子:
var str="hello"; //声明变量时,str是个字符串,不是对象
str.charAt(0);
String.prototype.charAt=function(){} //当字符串调用方法时,基本类型会找到对应的包装对象,然后包装对象消失,因此给基本类型添加方法,只需添加到其所对应的包装对象的原型即可:
var str="hello";
String.prototype.lastValue=function(){
return this.charAt(this.length-1);
}
alert(str.lastValue()); //o
var str="hello";
str.number=10;
alert( str.number ) //undefined 包装对象消失,str为一个新对象,新对象str是个String类型
总结
包装对象,可以把它认为是个不存在的。
当基本类型创建方法时,包装对象就会出现,此时基本类型变成对象,运行到下一行代码时包装对象消失。这也是包装对象存在的目的