JavaScript对象封装的简单实现方法(3种方法)


Posted in Javascript onJanuary 03, 2017

本文实例讲述了JavaScript对象封装的简单实现方法。分享给大家供大家参考,具体如下:

Javascript在HTML中变得越来越强大,富客户端,HTML5中的WebGL等。但是我们书写Javascript的时候往往很随意,使用对象的封装是极好的。这里介绍Javascipt三种创建对象的方法。

1. 使用关键字new创建对象

function Person(name, age) {
 this.name = name;
 this.age = age;
}
var p = new Person();  // 也可填充初始化属性,如new Person("lingceng", 22)

2. 使用Object直接创建对象

可以看出,这种方法扩展很方便。

var obj = new Object(); // 这里也可写成 var = {};
obj.name = "lingceng";
obj.age = 22;

3. 使用JSON创建(对象字面量的说法更准确,但JSON更好理解)

从Javascript1.2开始,创建对象有了更快捷的方式。

var p = {
 name: "lingceng", // "name":"lingceng这样加引号解析方式相同
 gender: "male"
};

实践方式

结合构造函数和原型模式创建对象的方式很适合实践。

function Person(name,age)
{
  // 实例属性
  // 实例时多份拷贝
  this.name=name;
  this.age=age;
}
Person.prototype={
  // 因为原型被替换,所以需要恢复construtor的默认指向
  constructor: Person,
  showName:function(){
    alert("ShowName in prototype:"+this.name);
  },
  showAge:function(){
    alert(this.age);
  }
}
var p = new Person("lingceng", 22);
p.showAge(); // 22

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript 权威指南(第四版) 读书笔记
Aug 11 Javascript
JavaScript字符串常用类使用方法汇总
Apr 14 Javascript
分享10个原生JavaScript技巧
Apr 20 Javascript
layer.close()关闭进度条和Iframe窗的方法
Aug 17 Javascript
微信小程序车牌号码模拟键盘输入功能的实现代码
Nov 11 Javascript
解决vue移动端适配问题
Dec 12 Javascript
小程序如何构建骨架屏
May 29 Javascript
Vue+Koa2+mongoose写一个像素绘板的实现方法
Sep 10 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
Sep 26 Javascript
vue实现点击按钮下载文件功能
Oct 11 Javascript
JS 数组和对象的深拷贝操作示例
Jun 06 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
Oct 15 Javascript
jquery插件treegrid树状表格的使用方法详解(.Net平台)
Jan 03 #Javascript
vue.js将unix时间戳转换为自定义时间格式
Jan 03 #Javascript
使用Angular缓存父页面数据的方法
Jan 03 #Javascript
JS实现简单的二元方程计算器功能示例
Jan 03 #Javascript
JS基于递归算法实现1,2,3,4,5,6,7,8,9倒序放入数组中的方法
Jan 03 #Javascript
javascript使用递归算法求两个数字组合功能示例
Jan 03 #Javascript
jQuery仿写百度百科的目录树
Jan 03 #Javascript
You might like
php不用正则采集速度探究总结
2008/03/24 PHP
php中设置index.php文件为只读的方法
2013/02/06 PHP
浅析linux下apache服务器的配置和管理
2013/08/10 PHP
PHP微框架Dispatch简介
2014/06/12 PHP
php防止网站被刷新的方法汇总
2014/12/01 PHP
JavaScript的eval JSON object问题
2009/11/15 Javascript
JQuery Ajax 跨域访问的解决方案
2010/03/12 Javascript
Javascript跨域请求的4种解决方式
2013/03/17 Javascript
JavaScript数据结构与算法之集合(Set)
2016/01/29 Javascript
详解Wondows下Node.js使用MongoDB的环境配置
2016/03/01 Javascript
基于javascript html5实现多文件上传
2016/03/03 Javascript
Bootstrap CSS使用方法
2016/12/23 Javascript
Angular的事件和表单详解
2016/12/26 Javascript
微信小程序 图片绝对定位(背景图片)
2017/04/05 Javascript
vue-devtools的安装步骤
2018/04/23 Javascript
微信小程序实现自上而下字幕滚动
2018/07/14 Javascript
ajax跨域访问遇到的问题及解决方案
2019/05/23 Javascript
微信小程序实现语音识别转文字功能及遇到的坑
2019/08/02 Javascript
nodejs语言实现验证码生成功能的示例代码
2019/10/13 NodeJs
vue elementui tree 任意级别拖拽功能代码
2020/08/31 Javascript
openlayers实现图标拖动获取坐标
2020/09/25 Javascript
在vant中使用时间选择器和popup弹出层的操作
2020/11/04 Javascript
JavaScript如何实现防止重复的网络请求的示例
2021/01/28 Javascript
Python寻找两个有序数组的中位数实例详解
2018/12/05 Python
python使用minimax算法实现五子棋
2019/07/29 Python
Python openpyxl读取单元格字体颜色过程解析
2019/09/03 Python
python超时重新请求解决方案
2019/10/21 Python
Python的形参和实参使用方式
2019/12/24 Python
Python3创建Django项目的几种方法(3种)
2020/06/03 Python
HTML5 虚拟键盘出现挡住输入框的解决办法
2017/02/14 HTML / CSS
创业计划书如何吸引他人眼球
2014/01/10 职场文书
校友会欢迎辞
2014/01/13 职场文书
平面设计专业求职信
2014/08/09 职场文书
大足石刻导游词
2015/02/02 职场文书
婚前保证书范文
2015/02/28 职场文书
JS如何使用剪贴板操作Clipboard API
2021/05/17 Javascript