JS中的对象定义方式,跟服务端,还是有很大差别的!

现在来说一下JS类的定义

工厂模式

function creatHeven(name,age){

  var temp =new Object();

  temp.age=age;

  temp.name=name;

  temp.say=function(){

    alert(this.name);

  };

  return temp;

}

var tempHeaven=creatHeaven('heaven','29');

大家可以看到工厂模式很简单,但是也有一些问题,它虽然解决了具有一些共性类的创建,但是我们无法知道当前创建的类是什么具体类型,只能知道是一个Object,例如不能知道 Date等;

为了解决这个问题,于是就有了构造函数模式创建类;

构造函数模式:

function CreatHeaven(name,age){

  this.name=name;

  this.age=age;

  this.say=function(){

    alert(this.name);

   };

}

var tempHeaven=new CreatHeaven('heaven',30);

大家看到,一些定义方式做了改变,类名称首字母也大写了,没有return,使用了new关键字;也能识别对象;

构造函数虽然好用,但是也是有缺点的,使用构造函数模式最大的缺点就是每次创建对象,都要创建方法,造成资源浪费,因此,我们可以将方法移到类外面,定义一个全局函数,但是这样看来并不像是一个类对象。

例如:

function say(){

  alert(this.name);

};

function CreatHeaven(name,age){

  this.name=name;

  this.age=age;

  this.say=say;

   };

}

var tempHeaven=new CreatHeaven('heaven',30);

这样做,显然失去了面向对象封装的意义,我们可以采用原型模式去创建一个对象;

原型模式:

我们创建的每个函数都有prototype原型属性,这个属相是一个指针,它指向一个对象;而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。使用原型对象的好处就是可以让所有对象实例共享它所包含的属性及方法

function CreatHeaven(name,age){

  CreatHeaven.prototype.name=name;

  CreatHeaven.prototype.age=age;

  CreatHeaven.prototype.say=function(){

    alert(this.name);

   };

}

var tempHeaven1=new CreatHeaven('heaven1',30);

var tempHeaven2=new CreatHeaven('heaven2',30);

原型模式也有缺点,就是如果属性是一个对象,例如数组;这样在创建实例的时候,就是公用这个数组,数组内容改变了,其他实例都是指向这个数组,值也会跟着变。这是我们不想要的结果。

所以出现了,”原型模式+构造函数模式“  的方式创建类实例;

原型模式+构造函数模式:

function CreatHeaven(name,age){

  this.name=name;

  thsi.age=age;

  

}

CreatHeaven.prototype.say=function(){

   alert(this.name);

};

var tempHeaven1=new CreatHeaven('heaven1',30);

tempHeaven1.say();

var tempHeaven2=new CreatHeaven('heaven2',30);

tempHeaven2.say()

每个实例都会有自己的一份实例属性,但同时又共享着方法,最大限度的节省了内存。另外这种模式还支持传递初始参数。优点甚多。这种模式在ECMAScript中是使用最广泛、认同度最高的一种创建自定义对象的方法。

动态原型模式:

unction CreatHeaven(name,age){

  this.name=name;

  this.age=age;

  if(typeof this.say!='function'){

      CreatHeaven.prototype.say=function(){

           alert(this.name);

      };

  }

}

var tempHeaven1=new CreatHeaven('heaven1',30);

tempHeaven1.say();

var tempHeaven2=new CreatHeaven('heaven2',30);

tempHeaven2.say()

动态原型模式将所有信息封装在了构造函数中,而通过构造函数中初始化原型(仅第一个对象实例化时初始化原型),这个可以通过判断该方法是否有效而选择是否需要初始化原型。

总结:以上就是几个创建类实例的模式,根据具体需要选择哪个创建模式;推荐使用 ”原型模式+构造函数模式“,”动态原型模式“。

js对象定义的更多相关文章

  1. JS 对象定义

    JS 对象 JavaScript 中的所有事物都是对象:字符串.数值.数组.函数... 此外,JavaScript 允许自定义对象. JavaScript 对象 JavaScript 提供多个内建对象 ...

  2. js对象定义的最常用的三种方法

    定义对象:属性和方法的结合体(变量和函数的结合体) 1.(***)var obj = {} 2.var obj = new Object(); 3.使用function定义对象 具体例子分别为: // ...

  3. [JS] 面向对象的5种写法和拓展JS对象的写法

    面向对象的JAVA  最开始当然是对象的定义了 收集了以下的五种写法 //第1种写法 function Circle(r) { this.r = r; } Circle.PI = 3.14159; C ...

  4. javascript对象定义和操作

    //js对象定义有三种方式//js方法定义有三种方式 function fn(){} var fun = function(){} var fun = new function() {} //**** ...

  5. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  6. js对象的定义及处理

    一,概述 在Java语言中,我们可以定义自己的类,并根据这些类创建对象来使用,在Javascript中,我们也可以定义自己的类,例如定义User类.Hashtable类等等. 目前在Javascrip ...

  7. JavaScript学习12 JS中定义对象的几种方式【转】

    avaScript学习12 JS中定义对象的几种方式 转自:  http://www.cnblogs.com/mengdd/p/3697255.html JavaScript中没有类的概念,只有对象. ...

  8. JS中定义对象和集合

    在js中定义对象: 方式一: var obj = {}; obj['a']=1; obj['b']=2; 方式二: var obj=new Object(); obj.a=1; obj.b=2; 在j ...

  9. JS组件系列——表格组件神器:bootstrap table 包含了js对象的定义和对象成员函数的定义

    前言:之前一直在忙着各种什么效果,殊不知最基础的Bootstrap Table用法都没有涉及,罪过,罪过.今天补起来吧.上午博主由零开始自己从头到尾使用了一遍Bootstrap Table ,遇到不少 ...

随机推荐

  1. iOS开发之──传感器使用 (转载)

    在实际的应用开发中,会用到传感器,下面首先介绍一下iphone4的传感器,然后对一些传感器的开发的API作一简单介绍. AD:WOT2015 互联网运维与开发者大会 热销抢票 在实际的应用开发中,会用 ...

  2. 数据持久化(一)--NSKeyedArchiver

    数据持久化:  将内存中的数据按某种格式存进磁盘 数据的种类: 1,结构化的数据 2, 字节流数据 结构化的数据        字节流 内存中结构化的数据   ->   磁盘,  叫: 归档 字 ...

  3. socket编程listen函数限制连接数的解决方案

    函数原型: int listen(int sockfd, int backlog); 当服务器编程时,经常需要限制客户端的连接个数,下面为问题分析以及解决办法: 下面只讨论TCP  UDP不做讨论(很 ...

  4. Hibernate连接mysql数据库并自动创建表

    天才第一步,雀氏纸尿裤,Hibernate第一步,连接数据库. Hibernate是一个开放源代码的对象关系映射框架,它对JDBC进行了非常轻量级的对象封装,它将POJO与数据库表建立映射关系,是一个 ...

  5. 在【Xamarin+Prism开发详解三:Visual studio 2017 RC初体验】中分享了Visual studio 2017RC的大致情况,同时也发现大家对新的Visual Studio很是感兴趣。于是发时间深入研究了一下Visual Studio 2017RC 是不是和微软Connect()://2016上说得一样神。

    总共列出了12点,耐心点慢慢看! 1,添加了不少[代码样式]的设置项目. 通过合理的设置每个人都能写出优美的代码,而且团队项目也可以达到统一代码风格. this首选项:可以设置[字段,属性,方法,事件 ...

  6. 面试问题-使用Java线程做数学运算

    这是一个展示如何使用join()方法的例子. 问题: 使用Java多线程计算表达式1*2/(1+2)的值. 解决方案: 使用一个线程做加法运算,另一个线程做乘法运算,还有一个主线程main做除法运算. ...

  7. SQL Server(四)——查询练习(45道习题)

    题目:设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher). 四个表的结构分别如表1-1的表(一)~表(四)所示,数据如表1 ...

  8. TSQL--临时表和表变量

    1. 临时表适用数据量较大的情况,因为临时表可以建立索引 2. 表变量适用于数据较小的情况,表变量只能在定义时创建约束(PRIMARY KEY/UNIQUE)从而间接建立索引 3. 临时表是事务性的, ...

  9. MySQL数据库的导入和导出

    1.导入数据库 在命令行下输入: mysql -u username -p test < /home/data/test.sql 说明: username                   是 ...

  10. 【JSP】JSP基础学习记录(一)—— 基础介绍以及3个编译指令

    序: 从实现到现在一直是以.net为主,但偶尔也会参与一些其他语言的项目.最近需要对一个Java Web项目进行二次开发,一直没学习过JSP所以买了几本书自学试试.参考资料为<轻量级Java E ...