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结构转字符串形式显示代码
Nov 15 Javascript
利用JavaScript阻止表单提交的两种方法
Aug 11 Javascript
CodeMirror js代码加亮使用总结
Mar 25 Javascript
解决bootstrap中使用modal加载kindeditor时弹出层文本框不能输入的问题
Jun 05 Javascript
jQuery Ajax向服务端传递数组参数值的实例代码
Sep 03 jQuery
bootstrap datetimepicker控件位置异常的解决方法
Nov 23 Javascript
解决Jquery下拉框数据动态获取的问题
Jan 25 jQuery
快速解决vue-cli不能初始化webpack模板的问题
Mar 20 Javascript
react-native封装插件swiper的使用方法
Mar 20 Javascript
js中innerText/textContent和innerHTML与target和currentTarget的区别
Jan 21 Javascript
微信小程序实现页面浮动导航
Jan 28 Javascript
vue-cli3配置favicon.ico和title的流程
Oct 27 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
简单谈谈PHP中的include、include_once、require以及require_once语句
2016/04/23 PHP
php redis实现对200w用户的即时推送
2017/03/04 PHP
文本加密解密
2006/06/23 Javascript
利用JQuery制作符合Web标准的QQ弹出消息
2014/01/14 Javascript
JavaScript学习笔记之内置对象
2015/01/22 Javascript
原生js实现的贪吃蛇网页版游戏完整实例
2015/05/18 Javascript
简单的js表格操作
2016/09/24 Javascript
JavaScript中动态向表格添加数据
2017/01/24 Javascript
详解webpack es6 to es5支持配置
2017/05/04 Javascript
Vue-cli proxyTable 解决开发环境的跨域问题详解
2017/05/18 Javascript
关于javascript获取内联样式与嵌入式样式的实例
2017/06/01 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
2018/07/26 Javascript
vue form 表单提交后刷新页面的方法
2018/09/04 Javascript
基于游标的分页接口实现代码示例
2018/11/12 Javascript
JS拖拽排序插件Sortable.js用法实例分析
2019/02/20 Javascript
js常见遍历操作小结
2019/06/06 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
antd日期选择器禁止选择当天之前的时间操作
2020/10/29 Javascript
python 将字符串转换成字典dict的各种方式总结
2018/03/23 Python
python3.6下Numpy库下载与安装图文教程
2019/04/02 Python
Python socket模块实现的udp通信功能示例
2019/04/10 Python
Python企业编码生成系统之主程序模块设计详解
2019/07/26 Python
python框架flask表单实现详解
2019/11/04 Python
pytorch中获取模型input/output shape实例
2019/12/30 Python
Python自动采集微信联系人的实现示例
2020/02/28 Python
python实现快递价格查询系统
2020/03/03 Python
Django中文件上传和文件访问微项目的方法
2020/04/27 Python
Python实现简单的2048小游戏
2021/03/01 Python
美国时尚女装在线:Missguided
2016/12/03 全球购物
地球上最先进的胡子和头发修剪器:Bevel
2018/01/23 全球购物
美国户外运动商店:Sun & Ski
2018/08/23 全球购物
宾馆仓管员岗位职责
2014/07/27 职场文书
公司离职证明范本
2014/10/17 职场文书
莫言诺贝尔获奖感言(全文)
2015/07/31 职场文书
python如何利用cv2模块读取显示保存图片
2021/06/04 Python
Python标准库pathlib操作目录和文件
2021/11/20 Python