创建、调用JavaScript对象的方法集锦


Posted in Javascript onDecember 24, 2014

今天在做项目时,遇到了需要创建JavaScript对象的情况。所以Bing了一篇老外写的关于3种创建JavaScript对象的文章,看后跟着打了一遍代码。感觉方法挺好的,在这里与大家分享一下。

  一、利用函数创建对象:

//定义对象

function Animal(type)

{

    this.name="";

    this.type=type;

   this.introduction=function(){

         return "我的名字是: "+this.name+",我属于 "+this.type;

}

}

var  animal=new Animal("家禽");   //实例化我们上面创建的对象

       animal.name="小红";

      alert(animal.introduction());      //调用它的introduction函数(此时,页面会弹出:我的名字是 小红,我属于 家禽);

这种方法,大家一定都很熟悉了。但是,使用这种方法会造成性能的损耗。在这里,我们是通过new关键子来实例化对象的。其实,new关键子是做了两件事。一,定义了一个匿名方法(Animal)。二、调用它。这样就不如我们接下来要介绍的方法高效了。

二、利用对象字面量(object literals):

     不知道翻译的对不对,待会我会把原文地址告诉大家,有兴趣的可以看原文。

//定义对象

    var Book=

    {

          name:"红楼梦",

          type:"文学作品",

          getAuthor:function()

    {

             return :"我是曹雪芹的孩子!";

    }

   }

      alert(Book.GetAuthor());  //调用对象方法,此时页面会出现:我是曹雪芹的孩子。

       Book.name="灌篮";   //修改对象属性

       alert(Book.name);    //此时,页面会弹出:灌篮

   相信大家看到代码,应该明白了为什么说这个方法会高效一些了。因为,它相当于定义了一个JavaScript全局变量。我们可以直接用它,不需要实例化它。但是,这样看起来怪怪的啊。那么,解决方案来了。我们来看看第三种方法吧。

 三、单例模式(Singleton using a function):

     翻译成单例模式,可能不是太妥。先看代码吧:

//定义对象

    var  Gender=new function()

 {

       this.type="女生";

      this.speaking=function()

{

      return "我是"+this.type;

}

}

     alert(Gender.speaking();)   //使用对象  此时页面会出现:我是女生。

  大家看这段儿代码,是不是与我们的方法一很像呢?但是,它可像方法一那样工作的。方法一,用一次对象,就要创建一次对象。这个方法,创建一次对象,就可以永久使用。所以,这种方式,很类似于设计模式中的单例模式。

Javascript 相关文章推荐
JavaScript学习笔记记录我的旅程
May 23 Javascript
解析Javascript小括号“()”的多义性
Dec 03 Javascript
js浮点数保留两位小数点示例代码(四舍五入)
Dec 26 Javascript
JQuery的Ajax请求实现局部刷新的简单实例
Feb 11 Javascript
jQuery中element选择器用法实例
Dec 29 Javascript
javascript动态添加checkbox复选框的方法
Dec 23 Javascript
Vue.js每天必学之指令系统与自定义指令
Sep 07 Javascript
Angular ui.bootstrap.pagination分页
Jan 20 Javascript
JavaScript实现无刷新上传预览图片功能
Aug 02 Javascript
详解angularJS+Ionic移动端图片上传的解决办法
Sep 13 Javascript
Vue 组件注册实例详解
Feb 23 Javascript
如何在Vue中使localStorage具有响应式(思想实验)
Jul 14 Javascript
jQuery的css()方法用法实例
Dec 24 #Javascript
使用javascript获取页面名称
Dec 23 #Javascript
jQuery类选择器用法实例
Dec 23 #Javascript
基于JQuery制作可编辑的表格特效
Dec 23 #Javascript
JavaScript调试工具汇总
Dec 23 #Javascript
jQuery制作简洁的多级联动Select下拉框
Dec 23 #Javascript
jQuery元素选择器用法实例
Dec 23 #Javascript
You might like
建立文件交换功能的脚本(三)
2006/10/09 PHP
PHP 日常开发小技巧
2009/09/23 PHP
php实现以只读方式打开文件的方法
2015/03/16 PHP
浅谈PHP实现大流量下抢购方案
2017/12/15 PHP
PHP7新特性
2021/03/09 PHP
javascript学习随笔(使用window和frame)的技巧
2007/03/08 Javascript
javascript 利用Image对象实现的埋点(某处的点击数)统计
2012/12/28 Javascript
百度地图api如何使用
2015/08/03 Javascript
基于JavaScript实现全屏透明遮罩div层锁屏效果
2016/01/26 Javascript
js实现(全选)多选按钮的方法【附实例】
2016/03/30 Javascript
js一维数组、多维数组和对象的混合使用方法
2016/04/03 Javascript
NodeJS遍历文件生产文件列表功能示例
2017/01/22 NodeJs
详解Node.js中exports和module.exports的区别
2017/04/19 Javascript
基于Require.js使用方法(总结)
2017/10/26 Javascript
javaScript字符串工具类StringUtils详解
2017/12/08 Javascript
微信小程序实现图片翻转效果的实例代码
2019/09/20 Javascript
小程序如何写动态标签的实现方法
2020/02/05 Javascript
javascript 数组精简技巧小结
2020/02/26 Javascript
python创建关联数组(字典)的方法
2015/05/04 Python
python 编写简单网页服务器的实例
2018/06/01 Python
django2.0扩展用户字段示例
2019/02/13 Python
python实现七段数码管和倒计时效果
2019/11/23 Python
python中seaborn包常用图形使用详解
2019/11/25 Python
HTML5网页录音和上传到服务器支持PC、Android,支持IOS微信功能
2019/04/26 HTML / CSS
Links of London官方网站:英国标志性的珠宝品牌
2017/04/09 全球购物
几个判断型的面试题
2012/07/03 面试题
医学生实习自我鉴定
2013/09/27 职场文书
班级寄语大全
2014/04/10 职场文书
党员创先争优活动总结
2014/05/04 职场文书
体育之星事迹材料
2014/05/11 职场文书
新教师培训方案
2014/06/08 职场文书
2014年生活老师工作总结
2014/12/23 职场文书
大学生求职自荐信
2015/03/24 职场文书
外出听课学习心得体会
2016/01/15 职场文书
JavaScript严格模式不支持八进制的问题讲解
2021/11/07 Javascript
一条慢SQL语句引发的改造之路
2022/03/16 MySQL