1 new Object()

先创建一个Object实例,然后为它添加属性和方法

var Person = new Object()
Person.name = 'hl'
Person.sayName = function () {
  console.log(this.name)
}

2 对象字面量法

对象字面量法是创建对象最快捷方便的方式,在很多场景下被使用。

var Person = {
  name: 'hl',
  sayName: function () {
    console.log(this.name)
  }
}

对象字面量法的缺点是创建多个同类对象时,会产生大量重复代码,因此有了工厂模式。

3 工厂模式

工厂模式用函数封装了创建对象的细节,调用函数时传入对象属性,然后返回一个对象。

function createPerson (name) {
  return {
    name: name,
    sayName: function () {
      console.log(this.name)
    }
  }
}
var person = createPerson('hl')
var person = new createPerson('hl') // 寄生构造函数模式

通过使用 new 操作符也可以获得同样的结果,这种方法被叫做寄生构造函数模式,(应该)与直接调用函数没什么区别。
工厂模式虽然解决了创建多个同类对象的问题,却无法识别对象是哪种具体类型。

4 构造函数模式

通过构造函数创建的对象,可以使用 instanceof 操作符可以确定对象的类型。按照编程惯例,构造函数命名应该大写,以和普通的函数区别开来。

function Person (name) {
  this.name = name
  this.sayName = function () {
    console.log(this.name)
  }
}
p = new Person('hl')
p instanceof Person // true

构造函数的特点:

  • 没有显示的创建对象
  • 属性和方法直接赋值给this
  • 没有 return 语句
  • 使用 new 操作符创建对象

构造函数的缺点是每个方法都会在每个实例上重新创建一遍,造成了内存浪费。

5 原型模式

使用原型模式,可以方便的为对象添加属性和方法。

function Person () {
}
var p = new Person()
Person.prototype.name = 'hl'
Person.prototype.sayName = function () {
  console.log(this.name)
}
p.sayName() // hl

原型具有动态性,即先创建对象再修改原型,实例也可以获得对应的属性和方法。
原型模式也并非没有缺点,第一,原型模式不能传递初始化参数,导致每个实例都会获得相同的属性;第二,对于引用类型的值,所有实例引用的是同一个对象,看下面的例子:

function Person () {
}
Person.prototype.relative = ['father','mother']

var person1 = new Person()
var person2 = new Person()
person1.relative.push('sister')
console.log(person2.relative) // [ 'father', 'mother', 'sister' ]

修改person1的属性,person2的属性也被修改了。实例一般是需要有属于自己的属性的,因此很少单独使用原型模式。

6 组合使用构造函数模式和原型模式

创建对象最常用的方式,就是组合使用构造函数模式和原型模式。构造函数用于自定义属性,原型模式用于定义共享的属性和方法。

function Person (name) {
  this.name = name
}
Person.prototype.sayName = function () {
  console.log(this.name)
}

7 动态原型模式

原型可以在构造函数中初始化,以便更好的封装对象创建过程。

function Person(name) {
  this.name = name
  if (typeof this.sayName !== 'function') {
    Person.prototype.setName= function (name) {
      this.name = name
    }
    Person.prototype.sayName = function () {
      console.log(this.name)
    }
  }
}

不必用if检查每一个属性或方法,只需要检查原型初始化后应该存在的其中一个属性或方法即可。

8 稳妥构造函数模式

稳妥对象指的是没有公共属性,其属性和方法也不引用this对象,并且不使用 new 操作符创建对象。适合用在一些需要安全的环境中,防止数据被修改。

function Person (name) {
  return {
    sayName: function () {
      console.log(name)
    }
  }
}
var person = Person('hl')

稳妥模式创建的对象,除了使用构造函数内定义的方法,没有办法修改和访问传入到构造函数中的原始数据。

创建对象的N种模式的更多相关文章

  1. javascript 创建对象的7种模式

    使用字面量方式创建一个 student 对象: var student = function (){ name : "redjoy", age : 21, sex: women, ...

  2. JavaScript中创建对象的三种模式

    JS中,便于批量创建对象的三种模式: 1.工厂模式:用一个函数封装创建对象的细节,传入必要的参数,在函数内部new一个对象并返回. 缺点:创建的对象无法识别类型(全是Object) 2.构造函数模式: ...

  3. javascript面向对象系列第二篇——创建对象的5种模式

    × 目录 [1]字面量 [2]工厂模式 [3]构造函数[4]原型模式[5]组合模式 前面的话 如何创建对象,或者说如何更优雅的创建对象,一直是一个津津乐道的话题.本文将从最简单的创建对象的方式入手,逐 ...

  4. javascript创建对象的几种模式

    在js中有几种模式可以创建对象,通过对象操作所包含的属性与方法. 一般来说,构造函数名称的第一个字母为大写字母,非构造函数名称的第一个字母为小写字母,当然,构造函数与一般函数唯一的区别只是调用的方式不 ...

  5. 《JAVASCRIPT高级程序设计》创建对象的七种模式

    细看javascript创建对象模式的诞生,具体的脉络为:不使用任何模式——工厂模式——构造函数模式——原型模式——组合使用构造函数模式——动态原型模式——寄生构造函数模式——稳妥构造函数模式.每一种 ...

  6. JavaScript中的对象-创建对象的7种模式

    文章来源:http://blog.csdn.net/u014346301/article/details/52204967 ECMA-262把对象定义为:”无需属性的集合,其属性可以包含基本值.对象或 ...

  7. 浅谈 JS 创建对象的 8 种模式

    1.Object 模式 var o1 = {};//字面量的表现形式 var o2 = new Object; var o3 = new Object(); var o4 = new Object(n ...

  8. JavaScript中创建对象的几种模式

    代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...

  9. JavaScript 创建对象的几种模式

    在JavaScript中虽说可以用Object的构造函数或者字面量创建单个对象,但是用这些方式来创建多个对象时就有一个明显的缺点,产生了大量的重复代码.为解决这些问题,许多模式就应运而生. 1. 工厂 ...

随机推荐

  1. 【Android】再来一篇Fragment懒加载(只加载一次哦)

    效果 老规矩,先来看看效果图 没错,我又入坑了,又重新做了个 Gank 客户端,因为之前那个代码写得太烂了,这次有好好的考虑了下架构之类的事,代码应该会更容易读懂了点了,吧.哈哈,再次欢迎来 star ...

  2. PHP环境搭建之PHPstorm9+PHP5开发环境配置

    以前写过一篇zend studio+WAMP的:点这里,个人感觉写得不怎么好可是阅读数却上千了... 不过笔者身边好多人开始用PHPStrom了,所以就简单的写个教程 一.下载安装 PHPStrom下 ...

  3. 给上传文件的input控件"美容"

    作为一名前端程序猿呢,在工作中经常会遇到form表单这种东西.然而表单的其他input控件样式还是很好改变的.但是,唯独input类型是file的文件上传控件可能就没那么好打扮的漂亮.刚好菜鸟我最近工 ...

  4. C#集合之链表

    LinkedList<T>是一个双向链表,其元素会指向它前面和后面的元素.这样,通过移动到下一个元素可以正向遍历链表,通过移动到前一个元素可以反向遍历链表. 链表在存储元素时,不仅要存储元 ...

  5. 思考题:用Use Case获取需求的方法是否有什么缺陷,还有什么地方需要改进?(提示:是否对所有的应用领域都适用?使用的方便性?.......)

    思考题: 用Use Case获取需求的方法是否有什么缺陷,还有什么地方需要改进?(提示:是否对所有的应用领域都适用?使用的方便性?.......) 简答: 一.用例解释: 在软件工程中,用例是一种在开 ...

  6. poj 1008

    #include<iostream>#include<string> using namespace std;string hname[19] = { "pop&qu ...

  7. Apple本地认证(密码+Touch id)

    转载请注明原文链接:http://www.cnblogs.com/zhanggui/p/6839554.html 前言 本片博客主要介绍如何在自己的APP中添加指纹解锁/密码解锁技术.主要是对苹果的L ...

  8. Android NDK开发之C调用Java及原生代码断点调试(二)

    上一篇中,我们主要学习了Java调用本地方法,并列举了两大特殊实例来例证我们的论据,还没学习的伙伴必须先去阅读下,本次的学习是直接在上一篇的基础上进行了.点击:Android NDK开发之从Java与 ...

  9. LNMP之编译安装PHP出现的问题

    2010年以前,互联网公司最常用的Web服务组合就是LAMP(即Linux.Apache.MySQL.PHP),近几年随着Nginx Web服务的逐渐流行,又出现了新的Web服务环境组合--LNMP ...

  10. poj2481 Cows 树状数组

    题目链接:http://poj.org/problem?id=2481 解题思路: 这道题对每组数据进行查询,是树状数组的应用.对于二维的树状数组, 首先想到排序.现在对输入的数据按右值从大到小排序, ...