`
zqh1986
  • 浏览: 10786 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js对象实例化

 
阅读更多
最近在看javascript高级程序设计,其中对对象的创建做了具体的阐述,综合起来,总结了下(je知识库javascript专栏由这方面的教程,有兴趣的可以去知识库看看)

第一种模式:工厂方式
Js代码 
1.var lev=function(){  
2. 
3.   return "啊打";  
4.};  
5.function Parent(){  
6.       var  Child = new Object();  
7.       Child.name="李小龙";  
8.       Child.age="30";  
9.       Child.lev=lev;  
10.     return Child;  
11.};  
12. 
13.var  x = Parent();  
14.alert(x.name);  
15.alert(x.lev()); 
var lev=function(){

   return "啊打";
};
function Parent(){
       var  Child = new Object();
       Child.name="李小龙";
       Child.age="30";
       Child.lev=lev;
     return Child;
};

var  x = Parent();
alert(x.name);
alert(x.lev()); 说明:

1.在函数中定义对象,并定义对象的各种属性,,虽然属性可以为方法,但是建议将属性为方法的属性定义到函数之外,这样可以避免重复创建该方法

2.引用该对象的时候,这里使用的是 var x = Parent()而不是 var x = new Parent();因为后者会可能出现很多问题(前者也成为工厂经典方式,后者称之为混合工厂方式),不推荐使用new的方式使用该对象

3.在函数的最后返回该对象

4.不推荐使用这种方式创建对象,但应该了解

第二种模式:构造函数方式
Js代码 
1.var lev=function(){  
2. 
3.   return "啊打";  
4.};  
5.function Parent(){  
6.        
7.       this.name="李小龙";  
8.       this.age="30";  
9.       this.lev=lev;  
10.     
11.};  
12. 
13.var  x =new  Parent();  
14.alert(x.name);  
15.alert(x.lev()); 
var lev=function(){

   return "啊打";
};
function Parent(){
     
       this.name="李小龙";
       this.age="30";
       this.lev=lev;
  
};

var  x =new  Parent();
alert(x.name);
alert(x.lev());

说明:

1.与工厂方式相比,使用构造函数方式创建对象,无需再函数内部重建创建对象,而使用this指代,并而函数无需明确return

2.同工厂模式一样,虽然属性的值可以为方法,扔建议将该方法定义在函数之外

3..同样的,不推荐使用这种方式创建对象,但仍需要了解

第3种模式:原型模式
Js代码 
1.var lev=function(){  
2. 
3.   return "啊打";  
4.};  
5.function Parent(){  
6.        
7.     
8.};  
9.  Parent.prototype.name="李小龙";  
10.  Parent.prototype.age="30";  
11. Parent.prototype.lev=lev;  
12. 
13.var  x =new  Parent();  
14.alert(x.name);  
15.alert(x.lev()); 
var lev=function(){

   return "啊打";
};
function Parent(){
     
  
};
  Parent.prototype.name="李小龙";
  Parent.prototype.age="30";
Parent.prototype.lev=lev;

var  x =new  Parent();
alert(x.name);
alert(x.lev()); 说明:

1.函数中不对属性进行定义

2.利用prototype属性对属性进行定义

3.同样的,不推荐使用这样方式创建对象

第四种模式:混合的构造函数,原型方式(推荐)
Js代码 
1.function Parent(){  
2.  this.name="李小龙";  
3. this.age=32;  
4.     
5.};   
6.Parent.prototype.lev=function(){  
7. 
8.   return this.name;  
9.};;  
10. 
11.var  x =new  Parent();  
12. 
13.alert(x.lev()); 
function Parent(){
  this.name="李小龙";
this.age=32;
  
};
Parent.prototype.lev=function(){

   return this.name;
};;

var  x =new  Parent();

alert(x.lev()); 说明:1.该模式是指混合搭配使用构造函数方式和原型方式

          2.将所有属性不是方法的属性定义在函数中(构造函数方式)

将所有属性值为方法的属性利用prototype在函数之外定义(原型方式)

3.推荐使用这样方式创建对象,这样做有好处和为什么不单独使用构造函数方式和原型方式,由于篇幅问题这里不予讨论

第五种模式:动态原型方式
Js代码 
1.function Parent(){  
2.  this.name="李小龙";  
3. this.age=32;  
4.;  
5. if(typeof Parent._lev=="undefined"){  
6.            
7.       
8.     Parent.prototype.lev=function(){  
9. 
10.               return this.name;  
11.     }  
12.     Parent._lev=true;  
13. }  
14.     
15.};   
16. 
17. 
18.var  x =new  Parent();  
19. 
20.alert(x.lev()); 
function Parent(){
  this.name="李小龙";
this.age=32;
;
if(typeof Parent._lev=="undefined"){
         
    
     Parent.prototype.lev=function(){

               return this.name;
     }
     Parent._lev=true;
}
  
};


var  x =new  Parent();

alert(x.lev()); 说明:

1.动态原型方式可以理解为混合构造函数,原型方式的一个特例

2.该模式中,属性为方法的属性直接在函数中进行了定义,但是因为

Js代码 
1.if(typeof Parent._lev=="undefined"){  
2.            
3.       
4.          Parent._lev=true;} 
if(typeof Parent._lev=="undefined"){
         
    
          Parent._lev=true;}

从而保证创建该对象的实例时,属性的方法不会被重复创建

3.,推荐使用这种模式
分享到:
评论

相关推荐

    js 面向对象实例

    综合以上知识,`js 面向对象实例`涵盖了JavaScript中的面向对象编程基础,以及如何将这些概念应用到HTML5 Canvas的实践中。通过学习和实践这个实例,你不仅可以理解JavaScript的OOP机制,还能掌握如何利用Canvas API...

    WebGL实例化.zip

    然而,实例化允许开发者通过共享相同的几何数据,仅改变每个实例的属性(如位置、旋转、缩放)来创建多个对象,从而显著提升渲染效率。 在“实例化.html”文件中,很可能展示了如何设置WebGL上下文,定义一个基本的...

    第四章示例代码__对象的实例化方式

    JavaScript,虽然它不是一种纯面向对象的语言,但仍然支持对象实例化。我们可以使用构造函数或原型链来实现: ```javascript function Person(name, age) { this.name = name; this.age = age; } var person1 = ...

    JS 对象实例讲解和应用

    一、JS对象实例的创建 1. 构造函数创建 构造函数是一种特殊类型的函数,用于创建和初始化特定类型的对象。例如: ```javascript function Person(name, age) { this.name = name; this.age = age; } var person1 =...

    实例化代码

    在编程领域,实例化是创建对象的关键步骤,它允许我们使用类定义来创建具有特定属性和行为的对象。在本实例中,我们将深入探讨如何通过代码实现动态效果的实例化,以便在应用程序中创建直观且引人入胜的用户体验。 ...

    javascript中使用new与不使用实例化对象的区别

    请问这以下两种实例化对象方式有什么区别呢? var mefun1 = new Me('fei','20','it'); var mefun2 = Me('fei','20','it'); 简单的说 第一种是构造函数式,即通过new运算符调用构造函数Function来创建函数 第二种...

    php学习笔记 类的声明与对象实例化

    - 类成员属性一般不在声明时直接赋予初值,而是在对象实例化之后通过方法进行赋值。 - 利用构造函数和析构函数来控制对象的创建和销毁过程。 - 遵循面向对象编程的原则,如封装、继承和多态性。 通过本篇笔记的学习...

    javaScript经典实例

    JavaScript内置的`JSON.parse()`和`JSON.stringify()`方法方便了JSON与JavaScript对象之间的转换。 7. **函数与闭包**:JavaScript中的函数不仅是代码块,还可以作为值传递和存储。闭包是JavaScript中一个强大的...

    js实例大全 js实例

    本"JS实例大全"聚焦于展示JavaScript在实际应用中的各种功能和技巧,帮助开发者更好地理解和掌握这门语言。 一、基础语法与数据类型 JavaScript的基础语法包括变量声明(var、let、const)、数据类型(如字符串、...

    javascript遍历json对象的key和任意js对象属性实例.docx

    在这个例子中,我们创建了一个`Pasta`构造函数并实例化了一个`spaghetti`对象。通过`Object.keys(spaghetti)`,我们可以得到一个包含所有属性名称的数组。需要注意的是,“toString”方法也被视为一个属性,因此它...

    Javascript面向对象编程.

    我们可以通过`new`关键字来调用构造函数,创建一个新的对象实例。例如: ```javascript function Person(name) { this.name = name; } var person1 = new Person('Alice'); ``` 在这个例子中,`Person`是构造...

    JSON与js对象序列化实例详解.docx

    总之,JSON与JavaScript对象之间的序列化和反序列化是数据交换的核心,它简化了客户端与服务器之间的数据交互,同时也提高了数据的可移植性和可读性。了解并熟练掌握JSON的使用,对于任何Web开发者来说都是至关重要...

    JS经典实例代码

    JavaScript,简称JS,是Web开发中的重要脚本语言,用于实现客户端...以上就是"JS经典实例代码"所涵盖的主要知识点,通过学习和实践这些实例,开发者可以掌握JavaScript的精髓,为构建功能丰富的网页应用打下坚实基础。

    JavaScript对象反射用法实例

    例如,创建一个对象实例后,可以使用Reflect.get和Reflect.set来动态读取和设置属性,使用Reflect.has来检查属性是否存在,使用Reflect.ownKeys来获取对象所有属性键的列表等。 此外,反射机制也常用于框架和库的...

    jsTree实例,jsTree实例

    **jsTree 实例详解** jsTree 是一个流行的 JavaScript 库,专门用于创建、操作和展示交互式的树型结构。在 Web 开发中,它常被用于构建目录结构、组织数据或者构建导航菜单。jsTree 提供了丰富的 API 和多种主题,...

    js经典实例 javascript经典实例 霓虹灯特效 js经典实例 javascript经典实例 霓虹灯特效

    根据提供的标题、描述、标签及部分内容,我们可以总结出本文主要关注的是JavaScript中实现的一个经典实例——霓虹灯特效。为了更好地理解这一知识点,我们将从以下几个方面进行深入探讨: ### 一、JavaScript简介 ...

    Javascript代码实现仿实例化类

    在JavaScript中,实现类的仿实例化是一种设计模式,它模拟了面向对象编程中的类实例化行为,但并不依赖于JavaScript的原型继承或者ES6中引入的class关键字。下面将结合给定文件内容,详细解释JavaScript仿实例化的...

    JavaScript实例应用 JavaScript实例应用

    9. **数据可视化**:JavaScript库如D3.js、Chart.js和Highcharts可以将复杂的数据转化为易于理解的图表和图形。 10. **Websocket**:JavaScript可以实现Websocket协议,提供实时双向通信,常用于在线聊天、实时股票...

    javascript经典实例大全

    你可能会看到如何解析JSON字符串为JavaScript对象,或者将对象转换为JSON字符串。 7. **面向对象编程**:JavaScript支持基于原型的面向对象编程,实例可能包含构造函数、原型链、继承和封装等概念的示例。 8. **...

Global site tag (gtag.js) - Google Analytics