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 相关文章推荐
根据分辨率不同,调用不同的css文件
Aug 25 Javascript
JavaScript语言核心数据类型和变量使用介绍
Aug 23 Javascript
jQuery实现菜单感应鼠标滑动动画效果的方法
Feb 28 Javascript
jQuery实现点击小图片淡入淡出显示大图片特效
Sep 09 Javascript
AngularJS入门教程之多视图切换用法示例
Nov 02 Javascript
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
Dec 01 Javascript
微信小程序-小说阅读小程序实例(demo)
Jan 12 Javascript
vue项目首屏加载时间优化实战
Apr 23 Javascript
vue实现带复选框的树形菜单
May 27 Javascript
javascript的惯性运动实现代码实例
Sep 07 Javascript
微信小程序wx.navigateTo方法里的events参数使用详情及场景
Jan 07 Javascript
深入详解JS函数的柯里化
Jun 09 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
解决ThinkPHP关闭调试模式时报错的问题汇总
2015/04/22 PHP
php实现图片以base64显示的方法
2016/10/13 PHP
php封装的page分页类完整实例
2016/10/18 PHP
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
解决jquery异步按一定的时间间隔刷新问题
2012/12/10 Javascript
JS将表单导出成EXCEL的实例代码
2013/11/11 Javascript
JS控件ASP.NET的treeview控件全选或者取消(示例代码)
2013/12/16 Javascript
js实现可控制左右方向的无缝滚动效果
2016/05/29 Javascript
windows 下安装nodejs 环境变量设置
2017/02/02 NodeJs
node.js 核心http模块,起一个服务器,返回一个页面的实例
2017/09/11 Javascript
vue路由嵌套的SPA实现步骤
2017/11/06 Javascript
详解VUE 对element-ui中的ElTableColumn扩展
2018/03/28 Javascript
ES6知识点整理之函数数组参数的默认值及其解构应用示例
2019/04/17 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
2019/09/28 Javascript
Vue常用的全选/反选的示例代码
2020/02/19 Javascript
vue2和vue3的v-if与v-for优先级对比学习
2020/10/10 Javascript
[54:09]RNG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.23
2019/09/05 DOTA
Python使用回溯法子集树模板获取最长公共子序列(LCS)的方法
2017/09/08 Python
Python+OpenCV图片局部区域像素值处理改进版详解
2019/01/23 Python
详细介绍pandas的DataFrame的append方法使用
2019/07/31 Python
python实现复制文件到指定目录
2019/10/16 Python
学Python 3的理由和必要性
2019/11/19 Python
Python3 A*寻路算法实现方式
2019/12/24 Python
pytorch逐元素比较tensor大小实例
2020/01/03 Python
pycharm 如何取消连按两下shift出现的全局搜索
2021/01/15 Python
CSS3的RGBA中关于整数和百分比值的转换
2015/08/04 HTML / CSS
Juice Beauty官网:有机美容产品,护肤与化妆品
2020/06/13 全球购物
党员干部承诺书范文
2014/03/25 职场文书
求职意向书
2014/04/01 职场文书
四风问题民主生活会对照检查材料思想汇报
2014/09/27 职场文书
实习生辞职信范文
2015/03/02 职场文书
运动会5000米加油稿
2015/07/21 职场文书
毕业生就业推荐表自我鉴定
2019/06/20 职场文书
Python中json.dumps()函数的使用解析
2021/05/17 Python
MyBatis自定义SQL拦截器示例详解
2021/10/24 Java/Android
7个关于Python的经典基础案例
2021/11/07 Python