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 相关文章推荐
TextArea不支持maxlength的解决办法(jquery)
Sep 13 Javascript
AngularJS中的Directive实现延迟加载
Jan 25 Javascript
AngularJS入门教程之XHR和依赖注入详解
Aug 18 Javascript
微信开发之调起摄像头、本地展示图片、上传下载图片实例
Dec 08 Javascript
jQuery Validate设置onkeyup验证的实例代码
Dec 09 Javascript
JavaScript函数节流和函数防抖之间的区别
Feb 15 Javascript
JavaScript 基础表单验证示例(纯Js实现)
Jul 20 Javascript
Vue中建立全局引用或者全局命令的方法
Aug 21 Javascript
webpack配置proxyTable时pathRewrite无效的解决方法
Dec 13 Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
Sep 11 Javascript
vue.js中使用微信扫一扫解决invalid signature问题(完美解决)
Apr 11 Javascript
uniapp 微信小程序 自定义tabBar 导航
Apr 22 Javascript
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
教你如何把一篇文章按要求分段
2006/10/09 PHP
php && 逻辑与运算符使用说明
2010/03/04 PHP
PHP 冒泡排序 二分查找 顺序查找 二维数组排序算法函数的详解
2013/06/25 PHP
destoon后台网站设置变成空白的解决方法
2014/06/21 PHP
php简单实现无限分类树形列表的方法
2015/03/27 PHP
PHP实现Google plus的好友拖拽分组效果
2016/10/21 PHP
解决laravel-admin 自己新建页面里 js 需要刷新一次的问题
2019/10/03 PHP
JS实现左右拖动改变内容显示区域大小的方法
2015/10/13 Javascript
使用Function.apply()的参数数组化来提高 JavaScript程序性能的技巧
2015/12/23 Javascript
jQuery实现简单的点赞效果
2020/05/29 Javascript
jQuery弹出下拉列表插件(实现kindeditor的@功能)
2016/08/16 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(二)
2016/09/14 Javascript
详解nodejs 文本操作模块-fs模块(五)
2016/12/23 NodeJs
关于AngularJs数据的本地存储详解
2017/01/20 Javascript
修改vue+webpack run build的路径方法
2018/09/01 Javascript
一篇文章,教你学会Vue CLI 插件开发
2019/04/17 Javascript
vue通过v-html指令渲染的富文本无法修改样式的解决方案
2020/05/20 Javascript
React冒泡和阻止冒泡的应用详解
2020/08/18 Javascript
Python入门篇之条件、循环
2014/10/17 Python
Python实现加载及解析properties配置文件的方法
2018/03/29 Python
python使用Matplotlib画饼图
2018/09/25 Python
window环境pip切换国内源(pip安装异常缓慢的问题)
2019/12/31 Python
Python之多进程与多线程的使用
2021/02/23 Python
CSS3中引入多种自定义字体font-face
2020/06/12 HTML / CSS
CSS3 box-shadow属性实例详解
2020/06/19 HTML / CSS
使用纯HTML5编写一款网页上的时钟的代码分享
2015/11/16 HTML / CSS
HTML5的postMessage的使用手册
2018/12/19 HTML / CSS
欧洲当代手工玻璃和瓷器的领先品牌:LSA International
2018/06/03 全球购物
美国正宗奢华复古手袋、珠宝及配饰网站:What Goes Around Comes Around
2018/07/21 全球购物
全球领先的美容用品专卖店:Beauty Plus Salon
2018/09/04 全球购物
GUESS Factory加拿大:牛仔裤、服装及配饰
2019/09/20 全球购物
保加利亚手表、香水、化妆品和珠宝购物网站:Brasty.bg
2020/04/22 全球购物
团委副书记工作总结
2015/08/14 职场文书
五星级酒店宣传口号
2015/12/25 职场文书
简历中的自我评价应该这样写!
2019/07/12 职场文书
详解MySQL InnoDB存储引擎的内存管理
2021/04/08 MySQL