您的位置:首页 > Web前端 > JavaScript

4.高级js--(面向对象js)_2

2014-03-23 19:02 387 查看
1.创建对象的三种方式:
l第一种构造法:new Object



var a = new Object();

a.x = 1, a.y = 2;



l第二种构造法:对象直接量



var b = { x : 1, y : 2 };



l第三种构造法:定义类型



function Point(x, y){

this.x = x;

this.y = y;

}

var p = new Point(1,2);



2.访问对象

l访问对象的属性



l中括号表示法:hero['name']。、

l点号表示法:hero.name。

l如果访问的属性不存在,会返回undefined。



l访问对象的方法



l方法名后加一对括号:hero.say()。

l像访问属性一个访问方法:hero['say']()。



3.删除属性与方法


//创建一个空对象

var hero = {};

//为hero对象增加属性和方法

hero.name = "javascript";

hero.value = "helloworld";

hero.sayName = function(){return "hello " + hero.name;};

//测试

alert(hero.name); //output javascript

alert(hero.sayName()); //output hello javascript

//删除hero对象的name属性

delete hero.name;

//测试

alert(hero.sayName()); //output hello undefined



4.使用this值



//创建一个空对象

var hero = {};

//为hero对象增加属性和方法

hero.name = "javascript";

hero.value = "helloworld";

hero.sayName = function(){return "hello " + this.name;};

//测试

alert(hero.name); //output javascript

alert(hero.sayName()); //output hello javascript

总结:




l这里的this实际上引用的是“这个对象”或“当前对象”。




lthis的用法,大部分人的使用问题都比较多。所以不建议过多使用!



5.内建对象


l内建对象大致上可以分为三个组:




l数据封装类对象 —— 包括Object、Array、Boolean、Number和String。这些对象代表着javascript中不同的数据类型,并且都拥有各自不同的typeof返回值,以及undefined和null状态。





l工具类对象 —— 包括Math、Date、RegExp等用于提供遍历的对象。




l错误类对象 —— 包括一般性错误对象以及其他各种更特殊的错误类对象。它们可以在某些异常发生时帮助我们纠正程序工作状态。



6.Object对象



lObject是javascript中所有对象的父级对象,这意味着所有对象都继承于Object对象。
l创建一个空对象:





var object = {};





var obj = new Object();



7.Array对象



lArray对象用于在单个的变量中存储多个值。

l创建一个空Array对象:




var object = {};



var obj = new Array();



例如1://反转字符串示例
//定义一个字符串

var str = "a,b,c,d,e,f,g";

//利用String对象的split()方法,将字符串切割成一个数组

var arr = str.split(",");

//利用Array对象的reverse()方法,将数组中元素的顺序颠倒。

arr = arr.reverse();

//测试打印

alert(arr.toString());

8.String对象



lString对象与基本的字符串类型之间的区别:




var str = "hello";




var obj = new String("world");




alert(typeof str); //typeof string




alert(typeof obj); //typeof object



例如1://判断字符串是否包含指定字符串示例

//定义两个要判断的字符串

var str = "abcdefg";

var substr = "efg";

/*

* 定义判断字符串是否包含指定字符串的函数

* * 第一个参数:要判断的字符串

* * 第二个参数:指定的字符串

*/

function sub(str,substr){

//将判断的字符串定义成String对象

var string = new String(str);

//截取判断的字符串

var result = string.substr(string.indexOf(substr),substr.length);

/*

* 判断截取后的字符串是否为空

* * 为空,说明不包含指定字符串

* * 不为空,说明包含指定字符串

*/

if(result==substr){

return true;

}else{

return false;

}

}

alert(sub(str,substr));



9.原型(prototype)


l函数本身也是一个包含了方法和属性的对象。而现在我们要研究的就是函数对象的另一个属性 —— prototype。




l利用原型添加方法与属性



l利用自身属性重写原型属性



l扩展内建对象





l利用原型添加方法与属性




l下面创建一个新的函数对象,并设置一些属性和方法:





function Hero(name, color){





this.name = name;





this.color = color;





this.whatareyou = function(){





return "I am a " + this.color + " " + this.name;





}





}









var hero = new Hero("javascript","red");









alert(hero.whatareyou()); //output I am a red javascript





l为上面的Hero函数对象增加一些属性和方法:





Hero.prototype.price = 100;





Hero.prototype.rating = 3;





Hero.prototype.getInfo = function(){





return "Rating: " + this.rating + " , Price: " + this.price;





}









alert(hero.getInfo()); //output Rating: 3 , Price: 100





l上面的方式,也可以这样去做:





Hero.prototype = {





price : 100,





rating : 3,





getInfo : function(){





return "Rating: " + this.rating + " , Price: " + this.price;





}





};




l利用自身属性重写原型属性




l如果对象的自身属性与原型属性同名该怎么办呢?答案是对象自身属性的优先级高于原型属性





function Hero(){



this.name = "jscript";



}






Hero.prototype.name = "javascript";






var hero = new Hero();






alert(hero.name); //output jscript






delete hero.name;






alert(hero.name); //output javascript



l扩展内建对象


//为原型 Array对象增加一个判断的函数



Array.prototype.inArray = function(color){



for(var i = 0, len = this.length; i < len; i++){





if(this[i] === color){





return true;





}





}



return false;



}






//定义一个Array对象



var a = ["red", "green", "blue"];






//测试



alert(a.inArray("red")); //true



alert(a.inArray("yellow")); //false



10.继承



l如果两个类都是同一个实例的类型,那么它们之间存在着某些关系,我们把同一个实例的类型之间的泛化关系称为“继承”。

l继承关系至少包含三层含义:

l子类的实例可以共享父类的方法。

l子类可以覆盖父类的方法或扩展新的方法。

l子类和父类都是子类实例的“类型”。

l在javascript中,并不支持“继承”。也就是说,javascript中没有继承的语法。从这个意义上来说,javascript并不是直接的面向对象语言。



11.原型链

l原型链是ECMAScript标准制定的默认继承方式。
例如:

function A(){



this.name = "a";

this.toString = function(){return this.name};



}

function B(){

this.name = "b";

}

function C(){



this.name = "c";

this.age = 18;

this.getAge = function(){return this.age};



}

B.prototype = new A();

C.prototype = new B();

解释说明:



l将对象直接创建在B对象的prototype属性中,并没有去扩展这些对象的原有原型。




l通过new A ( ) 另创建了一个新的实体,然后用它去覆盖该对象的原型。




ljavascript是一种完全依靠对象的语言,其中没有类(class)的概念。




l因此,需要直接用new A ( ) 创建一个实体,然后才能通过该实体的属性完成相关的继承工作。




l完成这样的继承实现之后,对 A ( ) 所进行的任何修改、重写或删除,都不会对 B ( ) 产生影响。



l 只继承于原型:



function A(){}

A.prototype.name = "a";

A.prototype.toString = function(){return this.name};

function B(){}

B.prototype = A.prototype;

B.prototype.name = "b";

function C(){}

C.prototype = B.prototype;

C.prototype.name = "c";

C.prototype.age = 18;

C.prototype.getAge = function(){return this.age};



l 对象之间的继承(扩展内容,可以不会)(浅复制)


//该函数接受一个对象并返回它的副本

function extendCopy(p){

var z = {}; //定义一个空的对象z

for(var i in p){ //var i =0 ; i < p.length ; i++




z[i] = p[i]; //都当做数组处理的话,可以理解




}

//uber属性:将p作为z的父级,将z指向p的原型

z.uber = p;

return z;

}

//定义对象a,但是对象a不是函数对象

var a = {

name : "a",

toStr : function(){return this.name;}

}

//定义对象b,但是对象b不是函数对象

var b = extendCopy(a);

b.name = "b";

b.toStr = function(){return this.uber.toStr() + " , " + this.name;};

//定义对象c,但是对象c不是函数对象

var c = extendCopy(b);

c.name = 18;

alert(c.toStr()); //output a , b , 18

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: