简单分析javascript面向对象与原型

 更新时间:2015年05月21日 10:05:00   投稿:hebedich  
为了说明 JavaScript 是一门彻底的面向对象的语言,首先有必要从面向对象的概念着手 , 探讨一下面向对象中的几个概念:1.一切事物皆对象,2.对象具有封装和继承特性,3.对象与对象之间使用消息通信,各自存在信息隐藏

本文主要内容参考来自JavaScript高级程序设计,面向对象与原型章节:

1、工厂模式

ECMAScript 可以通过工厂模式来创建对象:

//工厂模式
function createObject(name, age) {
  var obj = new Object();                  //创建对象
  obj.name = name;                      //添加属性
  obj.age = age;
  obj.run = function () {                    //添加方法
    return this.name + this.age + '运行中...';
  };
  return obj;                            //返回对象引用
};
var obj1 = createObject('Lee', 100);          //创建第一个对象
var obj2 = createObject('Jack', 200);          //创建第二个对象
//alert(obj1.run());                          //打印第一个对象实例的run()方法
//alert(obj2.run());                          //打印第二个对象实例的run()方法

//alert(typeof obj1);
//alert(typeof obj2);
alert(obj1 instanceof Object); //true
alert(obj2 instanceof Object); //true

通过工厂模式创建的对象,解决了重复实例化问题,但对象识别问题无法解决(所有对象均是Object),因此要想解决对象识别问题,我们采用下面的构造函数。

2、构造函数

//构造函数创建
function Person(name,age){  //所有构造函数对象都是Object
  this.name=name;
  this.age=age;
  this.run=function(){
    return this.name+this.age+"ing...";
  };
};
var person1=new Person('zhu1',100);
var person2=new Person('zhu2',200);
alert(person1.run());
alert(person2.run());

alert(person1 instanceof Object); //ture
alert(typeof person2);         //Person
alert(person2 instanceof Person);  // true
var person3=new Object();
Person.call(person3,'zhu3',300);//对象冒充,person3是Object类型,冒充Person类型
alert(person3.run()); 

构造函数中this:代表当前作用域对象的引用,如果在全局范围this代表window对象,如果在构造函数体内,就代表当前构造函数所声明的对象。

构造函数方法,及解决了重复实例化问题,有解决了对象识别问题,对比跟工厂方法不同之处可知:

1.构造函数方法没有显示的创建对象(new Object());

2.直接将属性和方法值赋值给this;

3.没有return 语句;

4.但是使用构造函数创建必须使用new运算符;

以上所述就是本文的全部内容了,希望大家能够喜欢。

相关文章

  • jQuery事件委托之Safari

    jQuery事件委托之Safari

    这篇文章主要介绍了jQuery事件委托之Safari 的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-07-07
  • 基于Jquery代码实现手风琴菜单

    基于Jquery代码实现手风琴菜单

    这篇文章主要介绍了基于Jquery代码实现手风琴菜单,代码简单易懂,需要的朋友参考下
    2015-11-11
  • jQuery移动和复制dom节点实用DOM操作案例

    jQuery移动和复制dom节点实用DOM操作案例

    复制节点也是常用的DOM操作之一,例如很多购物网站的效果,本文将介绍jQuery移动和复制dom节点等实用DOM操作,有需的朋友可以参考下
    2012-12-12
  • JQGrid的用法解析(列编辑,添加行,删除行)

    JQGrid的用法解析(列编辑,添加行,删除行)

    本文是对JQGrid的用法--列编辑,添加行,删除行。进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • jQuery实现TAB选项卡切换特效简单演示

    jQuery实现TAB选项卡切换特效简单演示

    这篇文章主要为大家详细介绍了jQuery实现TAB选项卡切换特效简单演示,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-03-03
  • jquery checkbox,radio是否选中的判断代码

    jquery checkbox,radio是否选中的判断代码

    jquery checkbox,radio是否选中的判断代码,需要的朋友可以参考下。
    2010-03-03
  • jQuery插件Easyui设置datagrid的pageNumber导致两次请求问题的解决方法

    jQuery插件Easyui设置datagrid的pageNumber导致两次请求问题的解决方法

    这篇文章主要介绍了jQuery插件Easyui设置datagrid的pageNumber导致两次请求问题的解决方法,较为详细的描述了出现的问题、问题的原因及相应的解决方法,需要的朋友可以参考下
    2016-08-08
  • jQuery中die()方法用法实例

    jQuery中die()方法用法实例

    这篇文章主要介绍了jQuery中die()方法用法,实例分析了die()方法的功能、定义及移除所有通过live()方法向指定元素添加的一个或多个事件处理程序的使用技巧,需要的朋友可以参考下
    2015-01-01
  • jQuery仿写百度百科的目录树

    jQuery仿写百度百科的目录树

    这篇文章主要介绍了jQuery仿写百度百科的目录树医保词条样式,点击右侧的目录树,左侧跳转到指定的锚点位置,滚动鼠标,游标跟随一起滚动至响应链接位置,具体实现思路大家参考下本文
    2017-01-01
  • Jquery实现图片左右自动滚动示例

    Jquery实现图片左右自动滚动示例

    图片左右滚动的效果想必大家都有见到过吧,其实很简单。在本文将为大家介绍下使用Jquery是如何实现图片左右自动滚动的,感兴趣的朋友可以参考下
    2013-09-09

最新评论