javascript面向对象创建对象的方式小结


Posted in Javascript onJuly 29, 2019

本文实例讲述了javascript面向对象创建对象的方式。分享给大家供大家参考,具体如下:

方式一:通过内置Object对象的方式创建 然后通过点语法,动态给对象创建属性,方法

var o1 = new Object();
o1.name = 'Tom';
o1.sing = function() {
 console.log('I am singing');
}

方式二:通过字面量json形式创建对象

var o2 = {
 "name":"jackson",
 "age":"10",
 "say":function(){
  console.log("say hi");
 };
};

方式三:通过构造函数创建

var o3 = function() {
 this.name = "Lucy",
 this.age = "10",
 this.say = function() {
  console.log("say hello");
 }
}

方式四:通过原型创建

var o4 = function() {}
o4.prototype = {
 "name":"Taylor",
 "age":10,
 "say":function(){
  console.log("say h1");
 }
}

方式五:通过原型和构造函数混合的形式创建(推荐使用这种,原因:尽量将方法定义为原型方法,原型方法避免了每次调用构造函数时对属性或方法的构造,节省空间,创建对象快)

var o5 = function() {
 this.name = 'James';
 this.age = 10;
}
o5.prototype = {
 "say":function() {
   console.log("say hi");
 }
}

方式六:拷贝模式创建对象

// 先要有一个拷贝模块
function extend(target,source){
 for(var k in source){
  target[k] = source[k];
 }
 return target;
};
var o6 = {
 "name":"o6",
 "age":10
}
var o7 = {
 "say":function() {
  console.log('say hi');
 }
}
// o6拷贝o7的方法,然后构建成一个新的对象
var o8 = extend(o6,o7);
o8.say(); // say hi

方式七:通过第三方库来创建对象

有 base2.js  和 simplejavascriptinheritance.js 来实现, 网上有资料。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

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

Javascript 相关文章推荐
json2.js的初步学习与了解
Oct 06 Javascript
非html5实现js版弹球游戏示例代码
Sep 22 Javascript
JavaScript设计模式之外观模式实例
Oct 10 Javascript
jQuery学习笔记之jQuery中的$
Jan 19 Javascript
javascript实现带节日和农历的日历特效
Feb 01 Javascript
js实现点击切换TAB标签实例
Aug 21 Javascript
node.js路径处理方法以及绝对路径详解
Mar 04 Javascript
js 单引号替换成双引号,双引号替换成单引号的实现方法
Feb 16 Javascript
jQuery中过滤器的基本用法示例
Oct 11 jQuery
解决vue2.0动态绑定图片src属性值初始化时报错的问题
Mar 14 Javascript
使用JSON格式提交数据到服务端的实例代码
Apr 01 Javascript
Vue路由守卫及页面登录权限控制的设置方法(两种)
Mar 31 Javascript
jquery.pager.js实现分页效果
Jul 29 #jQuery
vue-router跳转时打开新页面的两种方法
Jul 29 #Javascript
JS实现移动端点击按钮复制文本内容
Jul 28 #Javascript
微信小程序文字显示换行问题
Jul 28 #Javascript
vue router 跳转时打开新页面的示例方法
Jul 28 #Javascript
pageGroup.js实现分页功能
Jul 27 #Javascript
laypage+SpringMVC实现后端分页
Jul 27 #Javascript
You might like
VFP与其他应用程序的集成
2006/10/09 PHP
1.PHP简介
2006/10/09 PHP
资料注册后发信小技巧
2006/10/09 PHP
php简单实现批量上传图片的方法
2016/05/09 PHP
Yii2简单实现给表单添加验证码的方法
2016/07/18 PHP
(仅IE下有效)关于checkbox 三态
2007/05/12 Javascript
JQuery Ajax 跨域访问的解决方案
2010/03/12 Javascript
Web Inspector:关于在 Sublime Text 中调试Js的介绍
2013/04/18 Javascript
jQuery扁平化风格下拉框美化插件FancySelect使用指南
2015/02/10 Javascript
jQuery实现的网页竖向菜单效果代码
2015/08/26 Javascript
javascript之Array 数组对象详解
2016/06/07 Javascript
jQuery实现根据滚动条位置加载相应内容功能
2016/07/18 Javascript
详解使用angular-cli发布i18n多国语言Angular应用
2017/05/20 Javascript
原生JS实现N级菜单的代码
2017/05/21 Javascript
JS 实现获取验证码 倒计时功能
2018/10/29 Javascript
微信小程序上传图片并等比列压缩到指定大小的实例代码
2019/10/24 Javascript
微信小程序 this.triggerEvent()的具体使用
2019/12/10 Javascript
解决pycharm双击但是无法打开的情况
2020/10/31 Javascript
Python使用PIL库实现验证码图片的方法
2016/03/11 Python
Python3解决棋盘覆盖问题的方法示例
2017/12/07 Python
Python网络编程之TCP与UDP协议套接字用法示例
2018/02/02 Python
python DataFrame获取行数、列数、索引及第几行第几列的值方法
2018/04/08 Python
Python 隐藏输入密码时屏幕回显的实例
2019/02/19 Python
django表单的Widgets使用详解
2019/07/22 Python
Python表达式的优先级详解
2020/02/18 Python
Keras 数据增强ImageDataGenerator多输入多输出实例
2020/07/03 Python
Python类成员继承重写的实现
2020/09/16 Python
params有什么用
2016/03/01 面试题
销售经理工作职责范文
2013/12/03 职场文书
医学专业职业生涯规划范文
2014/02/05 职场文书
公司会计岗位职责
2014/02/13 职场文书
北京申奥口号
2014/06/19 职场文书
庆七一活动总结
2014/08/27 职场文书
2014国庆节商场促销活动策划方案
2014/09/16 职场文书
农村结婚典礼主持词
2015/06/29 职场文书
Python实现批量将文件复制到新的目录中再修改名称
2022/04/12 Python