1.工厂模式

function createPerson(name) {
var o = new Object();
o.name = name;
o.getName = function() {
console.log(this.name)
};
return o;
}
var person1 = createPerson('kevin')

缺点:对象无法识别,因为所以的实例都指向一个原型

2.构造函数模式

function Person(name) {
this.name = name;
this.getName = function() {
console.log(this.name);
}
} var person1 = new Person('kevin')

优点:实例可以识别为一个特定的类型

缺点:每次创建实例时,每个方法都要被创建一次

2.1构造函数模式优化

function Person(name) {
this.name = name;
this.getName = getName;
} function getName() {
console.log(this.name)
} var person1 = new Person('kevin')

优点:解决了每个方法都要被重新创建的问题

缺点:这叫啥封装...

3.原型模式

function Person(name) {
} Person.prototype.name = 'kevin';
Person.prototype.getName = function() {
console.log(this.name);
}
var person1 = new Person()

优点:方法不会重新创建

缺点:1.所有的属性和方法都共享 2.不能初始化参数

3.1原型模式优化

function Person(name) {

}

Person.prototype = {
name: 'kevin',
getName: function(){
console.log(this.name)
}
}
var person1 = new Person()

优点:封装性好一点

缺点:重写了原型,丢失了 constructor属性

3.2 原型模式优化

function Person(name) {}
Person.prototype = {
constructor: Person,
name:'kevin',
getName: function() {
console.log(this.name)
}
}
var person1 = new Person()

优点:实例可以通过constructor属性找到所属构造函数

缺点:原型模式该有的缺点还是有

4. 组合模式

构造函数模式与原型模式双剑合璧

function Person(name) {
this.name = name;
}
Person.prototype = {
constructor: Person,
getName: function() {
console.log(this.name)
}
}
var person1 = new Person()

优点:该共享的共享,该私有的私有,使用最广泛的方式

缺点: 有的人就是希望全部都写在一起,即更好的封装性

4.1 动态原型模式

function Person(name) {
this.name = name;
if (typeof this.getName != 'function') {
Person.prototype.getName = function() {
console.log(this.name)
}
}
}
var person1 = new Person()

注意:使用动态原型模式时,不能用对象字面量重写原型

解释下为什么:

function Person(name) {
this.name = name;
if (typeof this.getName != 'function') {
Person.prototype = {
constructor: Person,
getName: function() {
console.log(this.name)
}
}
}
} var person1 = new Person('kevin')
var person2 = new Person('marven') person1.getName() // 报错 并没有该方法 person2.getName() // 注释掉上面的代码,这句是可以执行的

Javascript深入之创建对象的多种方式以及优缺点的更多相关文章

  1. js创建对象的多种方式及优缺点

    在js中,如果你想输入一个的信息,例如姓名,性别,年龄等,如果你用值类型来存储的话,那么你就必须要声明很多个变量才行,变量声明的多了的话,就会造成变量污染.所以最好的方式就是存储到对象中.下面能我就给 ...

  2. js 创建对象的多种方式

    参考: javascript 高级程序设计第三版 工厂模式 12345678910 function (name) { var obj = new Object() obj.name = name o ...

  3. 基础2:js创建对象的多种方式

    js创建对象的多种方式 1. 工厂模式 function createPerson(name) { var o = new Object() 0.name = name return o } var ...

  4. JavaScript对象的几种创建方式与优缺点

    JavaScript中常见的几种创建对象的方式有:Object构造函数模式.对象字面量模式.工厂模式.自定义构造函数模式.构造函数加原型组合模式:他们各自有各自的优缺点和使用场景. 1. Object ...

  5. 【编程题与分析题】Javascript 之继承的多种实现方式和优缺点总结

    [!NOTE] 能熟练掌握每种继承方式的手写实现,并知道该继承实现方式的优缺点. 原型链继承 function Parent() { this.name = 'zhangsan'; this.chil ...

  6. JavaScript中判断为整数的多种方式

    之前记录过JavaScript中判断为数字类型的多种方式,这篇看看如何判断为整数类型(Integer). JavaScript中不区分整数和浮点数,所有数字内部都采用64位浮点格式表示,和Java的d ...

  7. javascript 处理链接的多种方式

    在页面中的链接除了常规的方式以外,如果使用javascript,还有很多种方式,下面是一些使用javascript,打开链接的几种方式: 1.使用window的open方法打开链接,这里可是在制定页面 ...

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

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

  9. Spring学习总结(一)——Spring实现IoC的多种方式

    控制反转IoC(Inversion of Control),是一种设计思想,DI(依赖注入)是实现IoC的一种方法,也有人认为DI只是IoC的另一种说法.没有IoC的程序中我们使用面向对象编程对象的创 ...

随机推荐

  1. Leetcode SingleNumber I & II & III 136/137/260

    SingleNumber I: 题目链接:https://leetcode-cn.com/problems/single-number/ 题意: 给定一个非空整数数组,除了某个元素只出现一次以外,其余 ...

  2. python爬虫之requests的基本使用

    简介 Requests是用python语言基于urllib编写的,采用的是Apache2 Licensed开源协议的HTTP库,Requests它会比urllib更加方便,可以节约我们大量的工作. 一 ...

  3. python(Django之组合搜索、JSONP、XSS过滤 )

    一.组合搜索 二.jsonp 三.xss过滤 一.组合搜索 首先,我们在做一个门户网站的时候,前端肯定是要进行搜索的,但是如果搜索的类型比较多的话,怎么做才能一目了然的,这样就引出了组合搜索的这个案例 ...

  4. kprobe原理解析

    参考  http://www.cnblogs.com/honpey/p/4575928.html kprobe是linux内核的一个重要特性,是一个轻量级的内核调试工具,同时它又是其他一些更高级的内核 ...

  5. 替换JDK 对eclipse的影响?

    问题  替换原有的JDK 对 eclipse有影响么? 之前用的eclipse是32位的,我的电脑是64位的,装的JDK是也是32位的,所以不影响使用! 但是,前两天装了一个ideal,新配置了一个9 ...

  6. Js返回上一页,刷新页面,定时刷新,改变地址栏 等常用实用技巧

    1. Javascript 返回上一页history.go(-1), 返回两个页面: history.go(-2); 2. history.back(). 3. window.history.forw ...

  7. The Xamarin Live Player Unpacked

    It is 2017, and it is almost criminal to say that your app doesn't work on a given mobile platform. ...

  8. Error: File 'C:\somepath\bin\ARM\Release\App_1.1.218.0_scale-100.appx' not found.

    Hi Everyone, We are working on a fix for this issue as quickly as we can, but we have identified a w ...

  9. .net core 2.0 数据访问-迁移

    将用于进行迁移的 Entity Framework Core NuGet包 添加到`.csproj`文件 <ItemGroup> <DotNetCliToolReference In ...

  10. 适用于Centos6.x系统的15项优化脚本

    1#!/bin/bash 2# Date: 2018-6-8 3#version:1.2 4#实现功能:一键系统优化15项脚本,适用于Centos6.x 5###################### ...