一、工厂模式


  • 流程: 定义一个函数,函数返回对象。
  • 适用场景: 需要创建多个对象,都是Object类型。
  • 优点:完成了返回一个对象的要求。
  • 缺点: 对象没有一个具体的类型,无法通过constructor识别对象, 都是Object类型。多个实例的sayName方法都是实现一样的效果,但是却存储了很多次。
// 1.工厂模式
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 // 返回对象
}
var p1 = createPerson('Tom', 12, 'student')
var p2 = createPerson('Mandy', 22, 'teacher') // 或者:
function createPerson (name, age, job) { // 返回一个对象的函数==》工厂函数
// 显式的创建对象
var o = {
name:name,
age:age,
job:job,
sayName: function () {
alert(this.name)
}
}
return o // 返回对象
}
var p1 = createPerson('Tom', 12, 'student')
var p2 = createPerson('Mandy', 22, 'teacher'

二、.构造函数模式


  • 流程:创建一个构造函数,没有显式地创建对象,没有return语句,通过new操作符创建对象。
  • 使用场景:需要创建多个类型确定的对象。
  • 优点:可以通过constructor或者instanceof来识别对象实例的类型。
  • 缺点:多个实例的sayName方法都是实现一样的效果,但是却存储了很多次(两个对象实例的sayName方法是不同的,因为存放的地址不同)。
function Person (name, age) {
this.name = name
this.age = age
this.sayName = function () {
alert(this.name)
}
}
var p1 = new Person('Tony', 14)
var p2 = new Person('Bob', 15

三、原型模式


  • 流程:创建一个构造函数,给这个函数的prototype添加属性和方法。通过new操作符创建对象。
  • 使用场景:起始时对象内部数据是确定的。
  • 优点:(1)sayName方法是共享的,所有实例的sayName方法都指向同一个。(2)可以动态的添加原型对象的方法和属性,并直接反映在对象实例上。
  • 缺点:(1)由于p1p2name属性指向同一块内存区域,因此改变p1.name会导致p2.name改变。(2)所有的方法都是共享的,没有办法创建自己的属性和方法,也没有办法像构造函数哪像传递参数。
function Person () {}
Person.prototype.name = 'Mandy'
Person.prototype.age = 16
Person.prototype.sayName = function () {
alert(this.name)
}
var p1 = new Person()
var p2 = new Person()
p1.sayName() // "Mandy"

四、构造函数+原型组合模式


  • 流程:自定义构造函数,属性在函数中初始化,方法添加到原型上。
  • 适用场景:需要创建多个类型确定的对象。
  • 优点:(1)解决了原型模式对于对象引用的问题。(2)解决了原型模式没有办法传递参数的问题。(3)解决了构造函数模式不能共享方法的问题。
function Person (name) {
this.name = name
}
Person.prototype.sayName = function () {
console.log(this.name)
}
var p1 = new Person('Mandy')
p1.sayName() // Mandy

五、动态原型模式


  • 流程:创建构造函数,在构造函数内部初始化属性,在构造函数内部在原型上添加方法。通过new操作符创建对象。
  • 需要创建多个类型确定的对象。
  • 优点:(1)可以在初次调用构造函数的时候就完成原型对象的修改。(2)对原型对象的修改能在所有的实例中反映。
  • 缺点:红宝书上说了这个方案非常完美。
function Person(name, age) {
// 属性
this.name = name
this.age = age
// 方法
// 判断sayName方法不存在的情况下,在原型上添加sayName方法。
if(typeof this.sayName != 'function') {
Person.prototype.sayName = function () {
console.log(this.name)
}
}
}
var p1 = new Person('Tom')
p1.sayName() // "Tom

六、寄生构造模式


  • 流程:创建一个构造函数,在这个函数内部创建一个对象,用return返回对象。通过new操作符创建。
  • 除了使用new操作符并把使用的包装函数叫做构造函数以外,这个模式与工程模式其实是一模一样的。
function Person(name, age) { // 将创建对象的代码封装在函数中。
// 显式创建要返回的对象
var o = new Object()
o.name = name
o.age = age
o.sayName = function () {
console.log(this.name)
}
return o // 返回对象
}
var p1 = new Person('Mandy',18)

七、稳妥构造模式


  • 优点:安全。除了调用sayName方法外,没有其他办法可以访问name的值。
function Person (name, age) {
// 创建要返回的对象
var o = new Object()
// 添加方法
o.sayName = function () {
console.log(this.name)
}
// 返回对象
return o
}
var p1 = new Person('Mandy',20)
p1.name // undefined
// 除了调用sayName方法外,没有其他办法可以访问name的值。
p1.sayName() // "Mandy"

javascript中创建对象的方式及优缺点(二)的更多相关文章

  1. javascript中创建对象的方式及优缺点(一)

    1. 简单方式创建对象 // 字面量方式创建对象 var person1 = { name: "xyc", age: 23, sayHi: function() { console ...

  2. javascript中创建对象的方式总结

    javascript中创建对象的方式总结 具体代码如下: //创建对象的方式: //创建方式一 var person=new Object(); person.name='jack'; person. ...

  3. javascript中各种继承方式的优缺点

    javascript中实现继承的方式有很多种,一般都是通过原型链和构造函数来实现.下面对各种实现方式进行分析,总结各自的优缺点. 一 原型继承 let Super = functioin(name = ...

  4. JavaScript中创建对象的三种方式!

    JavaScript中创建对象的三种方式! 第一种 利用对象字面量! // 创建对象的三种方式! // 1 对象字面量. var obj = { // 对象的属性和方法! name: 'lvhang' ...

  5. 深入理解JavaScript中创建对象模式的演变(原型)

    深入理解JavaScript中创建对象模式的演变(原型) 创建对象的模式多种多样,但是各种模式又有怎样的利弊呢?有没有一种最为完美的模式呢?下面我将就以下几个方面来分析创建对象的几种模式: Objec ...

  6. javascript中创建对象的几种不同方法

    javascript中创建对象的几种不同方法 方法一:最直白的方式:字面量模式创建 <script> var person={ name:"小明", age:20, s ...

  7. javascript 中继承实现方式归纳

    转载自:http://sentsin.com/web/1109.html 不同于基于类的编程语言,如 C++ 和 Java,javascript 中的继承方式是基于原型的.同时由于 javascrip ...

  8. javascript中创建对象和实现继承

    # oo ##创建对象 1. 原型.构造函数.实例之间的关系 * 原型的construct->构造函数:调用isPrototypeOf(obj)方法可以判定和实例的关系:  * 构造函数的pro ...

  9. JavaScript中你所不知道的Object(二)--Function篇

    上一篇(JavaScript中你所不知道的Object(一))说到,Object对象有大量的内部属性,而其中多数和外部属性的操作有关.最后留了个悬念,就是Boolean.Date.Number.Str ...

随机推荐

  1. docker 使用阿里云免费仓库

    阿里云为开发人员提供了免费的仓库~~ 登录阿里云 ,选择容器镜像服务,当前是2019/08/13 ,之后不知道阿里云控制台菜单会不会调整哈 进入容器镜像服务菜单,创建仓库,需要绑定git仓库 怎么上传 ...

  2. CF39H 【Multiplication Table】

    这题可以枚举出每个i,j 位置的数>需要用到进制转换 int zh(int x){ long long sum=0,i=0; while(x){ sum=sum+((x%n)*pow(10,i) ...

  3. CF949E Binary Cards 题解

    题面 首先发现:一个数最多会出现1次: 然后深入推出:一个数不会既用它又用它的相反数: 这样就可以依次考虑每一位了: 如果所有的数都不含有这一位,那么就直接把所有的数除以2 如果含有,那么就减去这一位 ...

  4. 2019CCPC-江西省赛 -A Cotree (树形DP,求树上一点到其他点的距离之和)

    我是傻逼我是傻逼 #include<bits/stdc++.h> using namespace std; const int maxn=4e5+50; typedef long long ...

  5. Python 入门 之 包

    Python 入门 之 包 1.包 (1)什么是包? 文件夹下具有_ init.py _的文件夹就是一个包 (2)包的作用: 管理模块(文件化) (3)包的导入: 导入: 启动文件要和包文件是同级 绝 ...

  6. EJS学习(三)之语法规则中

    ⚠️实例均结合node,也就是AMD规范版本 ejs中使用render()表示渲染文本 接收三个参数:模版字符串.data.options,返回一个字符串 const ejs = require('e ...

  7. qt webengineview 加载本地资源方式

    一.如果把资源添加到本地资源qrc库里了,请使用 ui->preview->setUrl(QUrl("qrc:/HelloWorld2.html")): 二.如果没有现 ...

  8. 本地存储cookie,localStorage,sessionStorage

    常见的前端存储有老朋友 cookie,短暂的 sessionStorage,和简单强大的localStorage 他们之间的区别有以下几点 1.. cookie在浏览器和服务器间来回传递.而sessi ...

  9. LeetCode——等差数列划分

    题目: 如果一个数列至少有三个元素,并且任意两个相邻元素之差相同,则称该数列为等差数列. 例如,以下数列为等差数列: 1, 3, 5, 7, 97, 7, 7, 73, -1, -5, -9 以下数列 ...

  10. 自己实现一个简化版的SpringMVC框架

    废话不多说,我们进入今天的正题,在Web应用程序设计中,MVC模式已经被广泛使用.SpringMVC以DispatcherServlet为核心,负责协调和组织不同组件以完成请求处理并返回响应的工作,实 ...