创建、调用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 相关文章推荐
新页面打开实际尺寸的图片
Aug 25 Javascript
根据分辨率不同,调用不同的css文件
Aug 25 Javascript
js实现的切换面板实例代码
Jun 17 Javascript
js实现二代身份证号码验证详解
Nov 20 Javascript
js实现添加可信站点、修改activex安全设置,禁用弹出窗口阻止程序
Aug 17 Javascript
jQuery表单事件实例代码分享
Aug 18 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
Apr 01 Javascript
详解Vue学习笔记入门篇之组件的内容分发(slot)
Jul 17 Javascript
vue移动端监听滚动条高度的实现方法
Sep 03 Javascript
如何自动化部署项目?折腾服务器之旅~
Apr 16 Javascript
vue实现随机验证码功能(完整代码)
Dec 10 Javascript
详解node和ES6的模块导出与导入
Feb 19 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
windows xp下安装pear
2006/12/02 PHP
php 不同编码下的字符串长度区分
2009/09/26 PHP
Search File Contents PHP 搜索目录文本内容的代码
2010/02/21 PHP
php遍历数组的方法分享
2012/03/22 PHP
PHP面向对象的进阶学习(抽像类、接口、final、类常量)
2012/05/07 PHP
比较discuz和ecshop的截取字符串函数php版
2012/09/03 PHP
PHP简单操作MongoDB的方法(安装及增删改查)
2016/05/26 PHP
js 提交和设置表单的值
2008/12/19 Javascript
javascript 特性检测并非浏览器检测
2010/01/15 Javascript
JQuery鼠标移到小图显示大图效果的方法
2015/06/10 Javascript
js实现仿qq消息的弹出窗效果
2016/01/06 Javascript
jQuery实现拼图小游戏(实例讲解)
2017/07/24 jQuery
深入掌握 react的 setState的工作机制
2017/09/27 Javascript
BootStrap 标题设置跨行无效的解决方法
2017/10/25 Javascript
使用mint-ui实现省市区三级联动效果的示例代码
2018/02/09 Javascript
在vue组件中使用axios的方法
2018/03/16 Javascript
详解如何更好的使用module vuex
2019/03/27 Javascript
Webpack3+React16代码分割的实现
2021/03/03 Javascript
跟老齐学Python之玩转字符串(2)更新篇
2014/09/28 Python
Python入门_浅谈字符串的分片与索引、字符串的方法
2017/05/16 Python
Python爬虫番外篇之Cookie和Session详解
2017/12/27 Python
python利用跳板机ssh远程连接redis的方法
2019/02/19 Python
python导包的几种方法(自定义包的生成以及导入详解)
2019/07/15 Python
Python字符串大小写转换拼接删除空白
2019/09/19 Python
BeautifulSoup中find和find_all的使用详解
2020/12/07 Python
python中time包实例详解
2021/02/02 Python
C面试题
2015/10/08 面试题
怎样在程序里获得一个空指针
2015/01/24 面试题
留学生如何写好自荐信
2013/12/27 职场文书
军训自我鉴定
2014/01/22 职场文书
工程承包协议书
2014/04/22 职场文书
2015年小学生新年寄语
2014/12/08 职场文书
2015年学校财务工作总结
2015/05/19 职场文书
乡镇党建工作总结2015
2015/05/19 职场文书
狂人日记读书笔记
2015/06/30 职场文书
详解盒子端CSS动画性能提升
2021/05/24 HTML / CSS