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

 更新时间:2019年07月29日 08:41:53   作者:Johnny丶me  
这篇文章主要介绍了javascript面向对象创建对象的方式,结合实例形式总结分析了javascript常见的7种创建对象的方式,需要的朋友可以参考下

本文实例讲述了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.jb51.net/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

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

相关文章

  • 微信小程序scroll-view点击项自动居中效果的实现

    微信小程序scroll-view点击项自动居中效果的实现

    这篇文章主要介绍了微信小程序scroll-view点击项自动居中效果的实现代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-03-03
  • 理解javascript中DOM事件

    理解javascript中DOM事件

    这篇文章主要帮助大家理解javascript中DOM事件,解决了DOM事件的兼容性,DOM事件的冒泡,以及DOM事件的重用,感兴趣的小伙伴们可以参考一下
    2015-12-12
  • Js event事件在IE、FF兼容性问题

    Js event事件在IE、FF兼容性问题

    FF没有window.event对象。可以通过给函数的参数传递event对象。
    2011-01-01
  • javascript自动改变文字大小和颜色的效果的小例子

    javascript自动改变文字大小和颜色的效果的小例子

    这篇文章介绍了javascript自动改变文字大小和颜色的效果的小例子,有需要的朋友可以参考一下
    2013-08-08
  • javascript Echart可视化学习

    javascript Echart可视化学习

    这篇文章主要为大家介绍了Echart可视化学习的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-01-01
  • JS实现将图片转为base64格式

    JS实现将图片转为base64格式

    Base64是一种用64个字符来表示任意二进制数据的方法,这篇文章主要为大家介绍了如何实现将图片转为base64格式,感兴趣的小伙伴可以学习一下
    2023-07-07
  • JS实现可点击展开与关闭的左侧广告代码

    JS实现可点击展开与关闭的左侧广告代码

    这篇文章主要介绍了JS实现可点击展开与关闭的左侧广告代码,通过鼠标onClick事件调用自定义javascript函数实现页面元素及样式的显示与隐藏效果,非常简单实用,需要的朋友可以参考下
    2015-09-09
  • JavaScript正则表达式验证登录实例

    JavaScript正则表达式验证登录实例

    这篇文章主要为大家详细介绍了JavaScript正则表达式验证登录实例,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-03-03
  • 微信小程序swiper组件实现抖音翻页切换视频功能的实例代码

    微信小程序swiper组件实现抖音翻页切换视频功能的实例代码

    这篇文章主要介绍了微信小程序swiper组件实现抖音翻页切换视频功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-06-06
  • 一个报数游戏js版(约瑟夫环问题)

    一个报数游戏js版(约瑟夫环问题)

    随便给一个数 比如100,那么从1到100围成一个圆圈,然后就类似123123报数一样逢3就舍掉,一直这样轮询 那么最后剩下来的那个数是多少?
    2010-08-08

最新评论