javascript设计模式Constructor(构造器)模式


Posted in Javascript onAugust 19, 2016

Constructor是一种在内存已分配给该对象的情况下,用于初始化新创建对象的特殊方法。Object构造器用于创建特定类型的对象?准备好对象以备使用,同事接收构造器可以使用参数,以在第一次创建对象时,设置成员属性和方法值。

对象创建
创新新对象,在javascript中通常有两种方法:
 1.对象直面量方法
var newObj = {};

 2.构造器的简洁方法
var newObj = new Object();
在Object构造器为特定的值创建对象封装,或者没有传递值时,它将创建一个肯那个对象并返回

 对象赋值的方法:
 1.“点”方法

//设置属性
newObj.name = 'LanFeng';
//获取值
var user= newObj.name;

 1.中括号方法

//设置属性
newObj["name"]= 'LanFeng';
//获取值
var user= newObj["name"];

 1.Object.defineProperty (适用ECMAScript5)

//设置属性
Object.defineProperty(newObj,"name",{
  value:"LanFeng",
  writable:true,
  enumerable:true,
  configurable:true
})

 1.Object.defineProperties

//设置属性
 Object.defineProperties(newObj,{
   "someKey":{
    value:"Hello Js",
     writable:true
  },
  "anotherKey":{
    value:"Foo bar",
    writable:false
  }
})

Javascript不支持类的概念,但它确实支持与对象一起用的特殊constructor函数,通过在构造器前面加new关键字,告诉js像使用构造器一样实例化一个新对象,并且对象成员由该函数定义。
在构造器内,关键字this引用新创建的对象。回顾对象创建,基本的构造器:

function Car(model,year,miles){
  this.model = model;
  this.year = year;
  this.miles = miles;
  this.toString = function(){
  return this.model + "has done" + this.miles +"miles";
  }
}
//创建实例化对象

var civio = new Car("Honda Civio",2009,20000);

var mondeo= new Car("Ford Mondeo",2009,5000);

上面例子是一个简单的构造器模式版本,但它确实存在一些问题,其中一个问题是,它使用继承变得困难,另外一个问题是,toString()这样的函数是为每个使用Car构造器创建的新对象而分别重新定义的,这个不是最理想的,因为这种函数应该在所有的Car类型实例直接共享。

javascript中有有一个prototype的属性,调用js构造器创建一个对象后,新对象就会具有构造器原型的所有属性,通过这种方式,可以创建多个对象,并访问相同的原型,实现方法共享。

function Car(model,year,miles){
  this.model = model;
  this.year = year;
  this.miles = miles;

}


//原型函数
Car.prototype.toString = function(){
  return this.model + "has done" + this.miles +"miles";
  }

//创建实例化对象

var civio = new Car("Honda Civio",2009,20000);
var mondeo= new Car("Ford Mondeo",2009,5000);
console.log(civio.toString())
console.log(mondeo.toString())

现在toString()的单一实例就能够在所有Car对着之间共享。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
浏览器解析js生成的html出现样式问题的解决方法
Apr 16 Javascript
制作jquery遮罩层效果导航菜单代码分享
Dec 25 Javascript
Javascript异步编程模型Promise模式详细介绍
May 08 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
Apr 29 Javascript
一分钟理解js闭包
May 04 Javascript
ES6概念 ymbol.for()方法
Dec 25 Javascript
你可能不知道的JSON.stringify()详解
Aug 17 Javascript
JavaScript屏蔽Backspace键的实现代码
Nov 02 Javascript
详解vue-cli之webpack3构建全面提速优化
Dec 25 Javascript
Angular脚手架开发的实现步骤
Apr 09 Javascript
laydate只显示时分 不显示秒的功能实现方法
Sep 28 Javascript
浅谈vue2的$refs在vue3组合式API中的替代方法
Apr 18 Vue.js
jQuery中实现prop()函数控制多选框(全选,反选)
Aug 19 #Javascript
Angular中$cacheFactory的作用和用法实例详解
Aug 19 #Javascript
AngularJS入门教程之更多模板详解
Aug 19 #Javascript
详解Angular中$cacheFactory缓存的使用
Aug 19 #Javascript
JS获取当前页面名称的简单实例
Aug 19 #Javascript
AngularJS应用开发思维之依赖注入3
Aug 19 #Javascript
JS获取当前使用的浏览器名字以及版本号实现方法
Aug 19 #Javascript
You might like
优化PHP代码的53条建议
2008/03/27 PHP
Codeigniter(CI)框架分页函数及相关知识
2014/11/03 PHP
功能强大的php文件上传类
2016/08/29 PHP
php实现当前页面点击下载文件的简单方法
2016/09/22 PHP
JQuery选择器绑定事件及修改内容的方法
2015/01/23 Javascript
详细分析JavaScript函数定义
2015/07/16 Javascript
Jquery 分页插件之Jquery Pagination
2015/08/25 Javascript
Boostrap模态窗口的学习小结
2016/03/28 Javascript
深入理解(function(){... })();
2016/08/16 Javascript
angular route中使用resolve在uglify压缩后问题解决
2016/09/21 Javascript
Vue + Vue-router 同名路由切换数据不更新的方法
2017/11/20 Javascript
在Vue项目中取消ESLint代码检测的步骤讲解
2019/01/27 Javascript
Vue退出登录时清空缓存的实现
2019/11/12 Javascript
vue项目中使用vue-layer弹框插件的方法
2020/03/11 Javascript
在js文件中引入(调用)另一个js文件的三种方法
2020/09/11 Javascript
[00:18]天涯墨客三技能展示
2018/08/25 DOTA
高性能web服务器框架Tornado简单实现restful接口及开发实例
2014/07/16 Python
用Python的Django框架来制作一个RSS阅读器
2015/07/22 Python
Python模拟浏览器上传文件脚本的方法(Multipart/form-data格式)
2018/10/22 Python
在python中只选取列表中某一纵列的方法
2018/11/28 Python
python解析含有重复key的json方法
2019/01/22 Python
Django ORM 查询管理器源码解析
2019/08/05 Python
python使用turtle库绘制奥运五环
2020/02/24 Python
浅谈django不使用restframework自定义接口与使用的区别
2020/07/15 Python
Python爬虫定时计划任务的几种常见方法(推荐)
2021/01/15 Python
探讨HTML5移动开发的几大特性(必看)
2015/12/30 HTML / CSS
Paul’s Boutique官网:英国时尚手袋品牌
2018/03/31 全球购物
触发器(trigger)的功能都有哪些?写出一个触发器的例子
2012/09/17 面试题
主键(Primary Key)约束和唯一性(UNIQUE)约束的区别
2013/05/29 面试题
培训主管岗位职责
2014/02/01 职场文书
一名老师的自我评价
2014/02/07 职场文书
给市场的环保建议书
2014/05/14 职场文书
社团活动总结报告
2014/06/27 职场文书
机动车登记业务委托书
2014/10/08 职场文书
入党积极分子对十八届四中全会期盼的思想汇报
2014/10/17 职场文书
村党的群众路线教育实践活动工作总结
2014/10/25 职场文书