JavaScript中的对象

ECMA-262把对象定义为:“无序属性的集合,其属性可以包含基本值、对象或者函数。”严格来讲,这就相当于说对象是一组没有特性顺序的值。对象的每一个属性或方法都有一个名字,而每个名字都映射到一个值。正因为这样(以及其他将要讨论的原因),我们可以把ECMAScript的对象想象成散列表:无非就是一组名值对,其中值可以使数据或函数。

new创建对象的步骤

使用new操作符创建对象会经历的4个步骤

1.创建一个新对象;

2.将构造函数的作用域赋给新对象

3.执行构造函数中的代码

4.返回新对象

模式一

简单工厂模式:

 function createPerson(name,age,job){
  var o=new Object();
  o.name=name;
  o.age=age;
  o.job=job;
  o.sayName=function(){
    alert(this.name);
  };
  return o;
}

优点:解决了创建多个相似对象,代码重复的问题;

缺点:没有解决对象识别的问题(即怎样知道一个对象的类型);

模式二

构造函数模式:

 function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
this.sayName=function(){
alert(this.name);
};
}

优点:可以把实例识别为一种具体的类型;

缺点:每个方法都要在每个实例上重新创建一遍;

模式三

原型模式:

 function Person(){
}
Person.prototype.name="Nicholas";
Person.prototype.age=29;
person.prototype.job="Software Engineer";
Person.prototype.sayName=function(){
  alert(this.name);
};

优点:可以让所有对象实例共享它所包含的属性和方法;

缺点:原型的共享本质,使所有实例共享相同属性值,对于引用类型的属性来说,改变一个实例的属性值会导致所有实例属性发生改变;

重点知识点:实例中的指针仅指向原型,与构造函数无关;

模式四

组合使用构造函数和原型模式(目前定义引用类型的一种默认模式):

 function Person(name,age,job){
  this.name=name;
  this.age=age;
  this.job=job;
  this.fridends=["Shelby","Court"];
} Person.prototype={
  constructor:Person,
  sayName:function(){
    alert(this.name);
  }
}

风格缺点:没有把所有信息封装在构造函数中,格式上没有封装性;

模式五

动态原型模式(保证了封装性):

 function Person(name,age,job){
  this.name=name;
  this.age=age;
  this.job=job;
  if(typeof this.sayName!="function"){
    Person.prototype.sayName=function(){
      alert(this.name);
    };
  }
}

注意:使用动态原型模式时,不能使用对象字面量重写原型。如果在已经创建了实例的情况下重写原型,那么就会切断现有实例与新原型之间的关系;

模式六

寄生构造函数模式:

 function Person(name,age,job){
  var o=new Object();
  o.name=name;
  o.age=age;
  o.job=job;
  o.sayName=function(){
    alert(this.name);
  };
  return o;
}

知识点:构造函数在不返回值的情况下,默认会返回新对象实例。而通过在构造函数的末尾添加一个return语句,可以重写调用构造函数时的返回值。

用处:因为原则上不应改变原生对象的原型,因此可以用此方法为已存在的对象(Array,String等)添加特殊方法
缺点:和工厂模式没有本质区别,无法用instanceof操作符确定对象类型

模式七

工厂方法模式:

相比于简单工厂,工厂方法即提供了对象的类型,又很容易创建大量对象,即每增加一个对象只需要修改一处。举例:

 var Factory=function(type,content){
  if(this instanceof Factory){
    var s=new this[type](content);
    return s;
  }else{
    return new Factory(type,content);
  }
} Factory.prototype={
  Java:function(content){
    //......
  },   JavaScript:function(content){
    //......
  }
}

JavaScript创建对象的方法汇总的更多相关文章

  1. javascript创建对象的方法--原型模式

    javascript创建对象的方法--原型模式 一.总结 1.原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改 2.原型的使用(p ...

  2. javascript创建对象的方法--基本模式

    javascript创建对象的方法--基本模式 一.总结 关注本质 二.代码 <!DOCTYPE html> <html lang="zh-cn"> < ...

  3. javascript创建对象的方法--动态原型模式

    javascript创建对象的方法--动态原型模式 一.总结 1.作用:解决组合模式的属性和函数分离问题  2.思路:基本思路和组合模式相同:共用的函数和属性用原型方式,非共用的的函数和属性用构造函数 ...

  4. javascript创建对象的方法--组合模式

    javascript创建对象的方法--组合模式 一.总结 0.作用:解决原型模式对象独有属性创建麻烦的问题 1.组合模式使用普遍:jquery就是用的组合模式,组合模式使用非常普遍 2.组合模式优点: ...

  5. javascript创建对象的方法--构造函数模式

    javascript创建对象的方法--构造函数模式 一.总结 构造函数模式作用和不足 1.作用:解决工厂模式不是用new关键字来创建对象的弊端 2.作用:解决工厂模式创建的实例和模型没有内在联系的问题 ...

  6. javascript创建对象的方法--工厂模式(非常好理解)

    javascript创建对象的方法--工厂模式(非常好理解) 一.简介 创建对象的方法 本质上都是把"属性"和"方法",封装成一个对象 创建对象的基本模式 普通 ...

  7. JavaScript Array 数组方法汇总

    JavaScript Array 数组方法汇总 1. arr.push() 从后面添加元素,返回值为添加完后的数组的长度 var arr = [1,2,3,4,5] console.log(arr.p ...

  8. web前端教程之javascript创建对象的方法

    今天给大家讲讲javascript基础教程中的javascript面向对象的技术,这一次我们深入的学习一下JavaScrip基于t面向对象之创建对象,关于面向对象的一些术语这里就不给大家介绍了,不了解 ...

  9. javascript创建对象的方法总结

    Javascript创建对象 最简单的方法:创建object实例. var person=new Object(); person.name="Joey";person.age=2 ...

随机推荐

  1. ON_UPDATE_COMMAND_UI和ON_COMMAND有什么区别?

    区别如下: UPDATE_COMMAND_UI表示处理菜单对应的用户界面显示状态. COMMAND表示处理该菜单对应的功能. 传统SDK程序要改变选单命令项状态,可以呼叫EnableMenuItem或 ...

  2. Chapter15 Principles of Metabolic Regulation

    15.1 调节代谢的通路 (1)细胞和有机体维持着动态稳定 调节作用的基因多 2500个 12% 激酶占比多 300个 一个通路受到多方调节 (2)酶的数量和催化活性 可以被调节 反应物的调控 糖酵解 ...

  3. 20169207《Linux内核原理与分析》第七周作业

    这周作业基本分为两个方面,第一方面,阅读学习教材「Linux内核设计与实现 (Linux Kernel Development)」第教材第9,10章.第二方面.学习MOOC「Linux内核分析」第五讲 ...

  4. 软工网络15团队作业4——Alpha阶段敏捷冲刺(一)

    第 1 篇 Scrum 冲刺: 各个成员在 Alpha 阶段认领的任务 成员      任务 预期任务量/小时 曾艺佳 学习模块:单词及其释义      单词发音     例句学习     添加笔记 ...

  5. web-day11

    第11章WEB11-Cookie&Session篇 今日任务 显示用户的上次访问时间 登录系统以后显示商品浏览记录 购买商品将商品添加到购物车 系统登录的验证码的校验 教学导航 教学目标 了解 ...

  6. PAT甲级 1130. Infix Expression (25)

    1130. Infix Expression (25) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Give ...

  7. ETL化的IOTA架构

    经过这么多年的发展,已经从大数据1.0的BI/Datawarehouse时代,经过大数据2.0的Web/APP过渡,进入到了IOT的大数据3.0时代,而随之而来的是数据架构的变化. ▌Lambda架构 ...

  8. ASP.NET实现头像剪切保存

    利用swfupload上传头像,利用Jcrop来实现头像在线选择,然后提交个ashx对原头像进行剪切.代码如下: default.aspx: <%@ Page Language="C# ...

  9. CSS 基础 例子 Image 高度设置

    body高度100%,三个image高度分别为auto,50%,60%,imge高度为当时body高度的百分比,auto时为原始高度 html代码如下: <!DOCTYPE html> & ...

  10. 如何获取 docker 容器(container)的 ip 地址

    1. 进入容器内部后 cat /etc/hosts 会显示自己以及(– link)软连接的容器IP 2.使用命令 docker inspect --format '{{ .NetworkSetting ...