`
隐形的翅膀
  • 浏览: 497119 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JAVASCRIPT定义对象的四种方式

阅读更多
先写一个函数,下面几个方式会用到
function showSalary(){
	alert(this.salary);
}



工厂方式
先创建对象,然后添加属性和方法,不需要用NEW创建对象,
如果把函数写在内部,每次调用都会创建新的函数,放在外面,封装性不好

function createWorker(sAage,sSalary,sDepartment){

  var oWorker=new Object();
  
  oWorker.age=sAage;
  
  oWorker.salary=sSalary;
  
  oWorker.department=sDepartment;
//创建函数的方式一,指向我们文章开头写好的函数名,缺点是函数在对象的外部,封装性不好
  oWorker.tellSalary=showSalary;
//创建函数的方式二,在对象内部声明匿名函数,虽然封装在对象内部了,但没个对象会有不同的函数版本,浪费内存
  oWorker.tellSalary=function(){
  	alert(this.salary);
  }
  
  return oWorker;
}

var worker1=createWorker(24,1000,"Dev");
worker1.tellSalary();

var worker2=createWorker(24,3000,"Dev");
worker2.tellSalary();



构造函数方式
在构造函数内部不创建对象,使用this关键字,创建时候用new操作符,如果把函数声明在内部,存在和工厂方式相同的问题,重复创建函数。为每个对象都创建独立的函数版本。放在外部,封装性不好

function Worker(sAage,sSalary,sDepartment){
	
  this.age=sAage;
  
  this.salary=sSalary;
  
  this.department=sDepartment;
  
  //同工厂方式
  this.tellSalary=showSalary;
  //同工厂方式
  this.tellSalary=function(){
  	alert(this.salary);
  }

}

var worker3=new Worker(24,1000,"Dev");
worker3.tellSalary();

var worker4=new Worker(24,3000,"Dev");
worker4.tellSalary();



原型方式,创建对象时不能使用构造传递参数,必须先创建对象,然后改变属性的值

function Worker(){
}


Worker.prototype.age=24;

Worker.prototype.salary=1000;

Worker.prototype.department="Dev";

Worker.prototype.homeaddress=new Array("www","dd");

// 创建多个对象时,要想一想此处为什么不会和构造函数方式及工厂方式一样,创建多个函数的实例

//要理解prototype的概念,prototype是父对象的一个实例

Worker.prototype.tellSalary=function(){
	alert(this.age);
}

var worker5=new Worker();

var worker6=new Worker();

worker5.tellSalary();

alert(worker5.homeaddress)

//修改原型中引用类型的值,会影响到所有已经实例化的对象
worker6.homeaddress.push("gg") 

alert(worker5.homeaddress)


混合原型和构造函数方式
可以传递参数构造对象,多个实例对象共享一个函数

function Worker(sAage,sSalary,sDepartment){
	
  this.age=sAage;
  
  this.salary=sSalary;
  
  this.department=sDepartment;
  
  this.homeaddress=new Array("www","dd");
  
}

//只创建tellSalary函数一个实例,没有内存浪费
Worker.prototype.tellSalary=function(){
	alert(this.age);
}

var worker7=new Worker(23,3000,"Dev");

var worker8=new Worker(43,1000,"Dev");

worker7.tellSalary();

alert(worker7.homeaddress) // ww dd

worker8.homeaddress.push("gg")

alert(worker7.homeaddress) //www dd

alert(worker8.homeaddress) // www dd gg


第四种的方式看上去也很散落,可以改进一下
var person=function(sname,sage){
   this.name=sname;
   this.age=sage;
};

person.prototype={
   tellName:function(){
         alert(this.name);
   },
   
   tellAge:function(){
         alert(this.age);
   }
};

优点:
  1. 可以传参数构造一个新对象
  2. 当有多个对象产生时,不会创建多个函数实体,没有内存浪费
  3. 封装想很好,属性和方法分开,

分享到:
评论
1 楼 hedong56 2012-01-02  
[/b][b][i][/i][u][/u][flash=200,200][/flash]
[size=small][/size]

相关推荐

    Javascript对象定义的几种方式

    Javascript对象定义的几种方式

    javascript定义对象

    下面将详细介绍JavaScript定义对象的四种主要方式:字面量语法、构造函数、对象解构和Proxy。 1. **字面量语法** 字面量语法是定义JavaScript对象最简单、最常见的方法。通过大括号`{}`来创建一个空对象,然后通过...

    JAVASCRIPT中定义对象的几种方式.pdf

    在讨论JavaScript中定义对象的几种方式之前,我们先理解一下JavaScript中的对象到底是什么。JavaScript是一种基于原型的编程语言,对象是其核心概念之一。对象可以被视为一个容器,存储各种键值对集合,键为属性名,...

    JavaScript定义类的几种方式总结

    JavaScript定义类的几种方式包括工厂方式、构造函数和原型方式,每种方法都有其特点和适用场景,接下来我们将详细探讨。 工厂方式是最早期的面向对象编程在JavaScript中的实践之一。使用工厂方式定义类,本质上就是...

    javascript工厂方式定义对象.docx

    本文主要探讨了四种常见的创建JavaScript对象的方法:工厂方式、构造函数方式、原型方式以及混合构造函数/原型方式。 1. **工厂方式**: 工厂模式是一种设计模式,它提供了一种创建对象的最佳方式。在JavaScript中...

    JavaScript学习之二 — JavaScript创建对象的8种方式

    本文将深入探讨JavaScript创建对象的8种常见方式,帮助你更好地理解和掌握这门动态类型的编程语言。 1. **字面量(Literal)方式** 这是最简单直接的创建对象的方式,通过大括号{}来定义一个对象,然后在内部用...

    JavaScript对象定义

    JavaScript是一种基于原型的对象导向语言,它的对象定义方式具有独特的灵活性。在本文中,我们将深入探讨JavaScript对象的定义、创建方法以及相关的工具和技术。 首先,我们要了解JavaScript对象的本质。对象是由...

    面向对象JavaScript精要(英文原版pdf)

    类本质上是对构造函数和原型模式的一种语法糖,提供了更简洁的方式来定义类和子类。 #### 四、本书主要内容概述 本书全面覆盖了面向对象编程的基础理论,并结合JavaScript的具体实现进行讲解。 - **第一章:...

    JavaScript定义类或函数的几种方式小结

    总结以上四种方式,在JavaScript中定义类或函数,可以根据实际的应用场景和需求,选择最合适的方式来实现对象的创建和管理。工厂方式适合创建不需要保持类型统一的对象;构造函数方式则更符合面向对象的原则;原型...

    Javascript 面向对象的JavaScript进阶

    在JavaScript中,可以通过构造函数或类来创建对象,并通过定义方法来隐藏具体的实现细节。此外,ES6引入了类的概念,进一步增强了抽象的能力。 **示例代码:** ```javascript class USBDevice { constructor(name)...

    Javascript面向对象编程

    这种方式定义的属性会被所有通过同一个构造函数创建的对象共享。 ##### 3.2 私有属性 私有属性可以通过闭包来实现: ```javascript function Student(name, age) { var privateName = name; // 私有属性 this....

    JavaScript面向对象编程指南.pdf

    JavaScript是一种高级的、解释型的编程语言,它支持面向对象的编程范式,允许开发者创建对象、使用继承和多态等面向对象的特性。以下是关于JavaScript面向对象编程的一些关键知识点: 1. 对象:在JavaScript中,...

    javascript面向对象编程.pdf

    JavaScript被设计成一种彻底的面向对象语言,尽管它的使用和接受过程中发生了发展和变化,吸引了其他如Ruby、Python、Perl等语言的程序员将他们的编程模式带入JavaScript。 JavaScript的面向对象编程与其他支持对象...

    JavaScript面向对象

    在JavaScript中定义JavaScript对象有两种方式: 方式一: var Book ={ getBookName:function(){ alert("获取书的名称") ; } }; 方式二 var oBook = function(){}; oBook.getBookName=...

    JavaScript面向对象编程指南(第2版).rar

    继承是JavaScript中实现代码复用的一种方式。通过原型链机制,一个对象可以“继承”另一个对象的属性和方法。原型(prototype)是JavaScript中的关键概念,每个对象都有一个隐式的__proto__属性,指向其构造函数的...

    javascript创建对象的方式(三)

    本文将详细探讨三种主要的创建JavaScript对象的方法,并结合“源码”与“工具”的概念,来深入理解这些方式在实际开发中的应用。 一、字面量(Literal)方式 这是最简单直接的对象创建方式,通过大括号 `{}` 将属性...

    JavaScript面向对象基础.ppt

    创建对象通常有两种方式:字面量语法和构造函数。例如,创建一个名片对象: ```javascript var card = { name: 'John Doe', address: '123 Main St', phone: '555-1234', displayInfo: function() { console....

    javascript面向对象

    本文旨在深入解析JavaScript面向对象编程的基础,包括对象的基本概念、类与对象的关系、对象的属性与方法、封装、继承与多态,以及JavaScript中对象的实现方式。 #### 对象的基本概念 面向对象编程的核心在于对...

Global site tag (gtag.js) - Google Analytics