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 相关文章推荐
从零开始学习jQuery (四) jQuery中操作元素的属性与样式
Feb 23 Javascript
js形成页面的一种遮罩效果实例代码
Jan 04 Javascript
JS产生随机数的几个用法详解
Jun 22 Javascript
EasyUI加载完Html内容样式渲染完成后显示
Jul 25 Javascript
详解AngularJs中$sce与$sceDelegate上下文转义服务
Sep 21 Javascript
Jquery针对tr td的一些实用操作方法(必看篇)
Oct 05 Javascript
jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)
Dec 22 Javascript
js中常用的Math方法总结
Jan 12 Javascript
关于Node.js的events.EventEmitter用法介绍
Apr 01 Javascript
小程序实现列表点赞功能
Nov 02 Javascript
vue2路由方式--嵌套路由实现方法分析
Mar 06 Javascript
在vue中实现某一些路由页面隐藏导航栏的功能操作
Sep 21 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
域名和cookie问题(域名后缀)
2012/10/10 PHP
mysqli_set_charset和SET NAMES使用抉择及优劣分析
2013/01/13 PHP
利用php递归实现无限分类 格式化数组的详解
2013/06/08 PHP
ThinkPHP模板替换与系统常量及应用实例教程
2014/08/22 PHP
thinkPHP多域名情况下使用memcache方式共享session数据的实现方法
2016/07/21 PHP
PHP实现针对日期,月数,天数,周数,小时,分,秒等的加减运算示例【基于strtotime】
2017/04/19 PHP
JavaScript的面向对象(二)
2006/11/09 Javascript
Jquery+JSon 无刷新分页实现代码
2010/04/01 Javascript
JQuery动态给table添加、删除行 改进版
2011/01/19 Javascript
javascript中parseInt()函数的定义和用法分析
2014/12/20 Javascript
跟我学习javascript的var预解析与函数声明提升
2015/11/16 Javascript
JAVA Web实时消息后台服务器推送技术---GoEasy
2016/11/04 Javascript
JS实现移动端按首字母检索城市列表附源码下载
2017/07/05 Javascript
js实现图片局部放大效果详解
2019/03/18 Javascript
深入理解 TypeScript Reflect Metadata
2019/12/12 Javascript
vue+ts下对axios的封装实现
2020/02/18 Javascript
Python处理RSS、ATOM模块FEEDPARSER介绍
2015/02/18 Python
Python里disconnect UDP套接字的方法
2015/04/23 Python
Python实现的爬取网易动态评论操作示例
2018/06/06 Python
Python中pandas模块DataFrame创建方法示例
2018/06/20 Python
Python3基于print打印带颜色字符串
2020/07/06 Python
深入CSS3 动画效果的总结详解
2013/05/09 HTML / CSS
使用phonegap获取设备的一些信息方法
2017/03/31 HTML / CSS
美国知名男士服饰品牌:Brooks Brothers(布克兄弟)
2016/08/25 全球购物
Darphin迪梵官网: 来自巴黎,植物和精油调制的护肤品牌
2016/10/11 全球购物
复古斯堪的纳维亚儿童服装:Baby go Retro
2017/09/09 全球购物
俄罗斯设计师家具购物网站:The Furnish
2019/12/01 全球购物
美国高端牛仔品牌:Silver Jeans
2019/12/12 全球购物
学前教育专业毕业生自荐信
2013/10/03 职场文书
8和9的加减法教学反思
2014/05/01 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
终止劳动合同证明书样本
2014/11/19 职场文书
团委副书记工作总结
2015/08/14 职场文书
Pytorch使用shuffle打乱数据的操作
2021/05/20 Python
「月刊Comic Alive」2022年5月号封面公开
2022/03/21 日漫
vue如何实现关闭对话框后刷新列表
2022/04/08 Vue.js