三种简单写法教你Javascript对象封装

Javascript在HTML中变得越来越强大, HTML5中的WebGL等。但是我们书写Javascript的时候往往很随意,使用对象的封装是极好的。这里介绍Javascipt三种创建对象的方法。
使用关键字 new 创建对象
Js 代码   [url=]file:///C:/Users/ADMINI~1/AppData/Local/Temp/msohtmlclip1/01/clip_image002.gif[/url]
1.      
2.    function Person(name, age) {   
3.      this.name = name;  
4.      this.age = age;  
5.   }  
6.    var p =  new Person();   // 也可填充初始化属性,如new Person("lingceng", 22)   

使用 Object 直接创建对象
可以看出,这种方法扩展很方便。
Js 代码   [url=]file:///C:/Users/ADMINI~1/AppData/Local/Temp/msohtmlclip1/01/clip_image002.gif[/url]
1.      
2.    var obj =  new Object(); // 这里也可写成 var = {};  
3.   obj.name = "lingceng";  
4.   obj.age = 22;  

使用 JSON 创建(对象字面量的说法更准确,但 JSON 更好理解)
从Javascript1.2开始,创建对象有了更快捷的方式。
Js 代码   [url=]file:///C:/Users/ADMINI~1/AppData/Local/Temp/msohtmlclip1/01/clip_image002.gif[/url]
1.    var p = {  
2.     name: "lingceng",  // "name":"lingceng这样加引号解析方式相同  
3.     gender: "male"  
4.   };  

实践方式
    结合构造函数和原型模式创建对象的方式很适合实践。
Js 代码   [url=]file:///C:/Users/ADMINI~1/AppData/Local/Temp/msohtmlclip1/01/clip_image002.gif[/url]
1.    function Person(name,age)  
2.   {  
3.       // 实例属性  
4.       // 实例时多份拷贝  
5.        this.name=name;  
6.        this.age=age;  
7.   }  
8.            
9.   Person.prototype={  
11.          //constructor属性始终指向创建当前对象的构造函数  
12.          // 因为原型被替换,所以需要恢复construtor的默认指向  
13.      constructor: Person,  
14.      showName: function(){  
15.          alert("ShowName in prototype:"+ this.name);  
16.      },  
17.      showAge: function(){  
18.          alert( this.age);  
19.      }  
20.  }  
21.   
22.   var p =   new Person("lingceng", 22);  

23.  p.showAge(); // 22  

原文地址:http://www.jz-net.cn/forum.php?mod=viewthread&tid=12378&extra=page%3D1

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值