对Js OOP编程 创建对象的一些全面理解

 更新时间:2016年07月26日 08:45:42   投稿:jingxian  
下面小编就为大家带来一篇对Js OOP编程 创建对象的一些全面理解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

面向对象是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物。

对象的含义

对象可以是汽车,人,动物,文字,表单或者任何存在的事物等等。

对象有:

  属性-------对象的某些特定的性质。
  方法-------对象能做的事情。
  事件-------能响应发生在对象上的事情。

我们可以通过创建一个人的对象来理解面向对象

人:

  两只手,两只脚,一个头,还可以跑动。

  手,脚,头,是人的属性,跑动是人的方法。

首先,我们来用最简单的方法创建一个对象

var person = {
      head: "one",
      hand: "two",
      foot: "two",
      run : function(){
        console.log("running");
      }
    }

这个方法一点都不实用,因为它是创建一个单独的对象,,而这个对象和任何常见的数据结构没有任何联系。

然后,我们用构造函数的方式创建一个对象

var Person = function(){//注意,首字母大写
      this.head = "one",
      this.hand = "two",
      this.foot = "two",
      this.run = function(){
        alert("running");
      }
    }
    var Joan = new Person();
    document.write(Joan.run())// "running"

这是用构造函数创建的对象,然后我们再加上一行代码看看

var Niki = new Person();
    alert(Joan==Niki) //false;

是的,现在创建了是两个不同的对象实例。

在JavaScript中的每个函数都有一个prototype的属性.如果某个函数被用作构造函数,则这个属性会被自动通过new调用创建对象的原型

console.log(Joan)

可以看到有一个__proto__:Person,其中__proto__是Joan的原型链.它是指向Person的原型.

JS在创建对象(不论是普通对象还是函数对象)的时候,都有一个叫做__proto__的内置属性,用于指向创建它的函数对象的原型对象prototype。

关于原型链的一些理解,在JavaScript高级程序设计 一书中写的非常详细。有兴趣的可以去看看,网上也有pdf的文档可以找到。不过建议还是买本书,支持原版嘛。

然后对prototype这个原型属性的任何更改能够应用于用new Person()构造的每一个实例对象,不管它是在更改之前还是更改后创建.为Person.prototype 添加新函数.具体如下:

var Person = function(){//注意,首字母大写
      this.head = "one",
      this.hand = "two",
      this.foot = "two"
    }
    Person.prototype.run = function(){
      alert("running");
    }
    var Joan = new Person();
    Joan.run()// "running"
    alert(Joan.__proto__===Person.prototype)//'true'

可以看到,在原型中创建方法是可以调用的,同时Joan的原型链是指向Person的原型的。

再看:

var Niki = new Person();//"runing"
     Person.prototype.run = function(){
       alert("running running")
     }
     Joan.run()//"running running"
     Niki.run()//"running running"

看,修改Person的原型方法,所有被new Person()创建的对象实例中的方法都被修改了,因为所有实例中共用的是同一个原型方法run。这就是原型的一种应用。

这就是关于创建对象的一些理解。

写了好久。也不知道有没有错误。 如果有错误,欢迎各位大大指点。

下次再写面向对象继承方面的东西。

以上就是小编为大家带来的对Js OOP编程 创建对象的一些全面理解全部内容了,希望大家多多支持脚本之家~

相关文章

  • javascript类型转换使用方法

    javascript类型转换使用方法

    这篇文章主要介绍了javascript类型转换的使用方法,包括转换为字符串、转换为数字、转换为布尔值、转换为对象使用方法,大家参考使用吧
    2014-02-02
  • jQuery之选择组件的深入解析

    jQuery之选择组件的深入解析

    本篇文章是对jQuery中的选择组件进行了详细的分析介绍,需要的朋友参考下
    2013-06-06
  • Javascript this 关键字 详解

    Javascript this 关键字 详解

    Javascript是一种很灵活的语言, 而This关键字又是灵活中的灵活, 但是因为它的灵活, 也注定了它的难用.以前我用this的时候, 都会觉得不踏实, 老是担心它不知道怎么地就会指到另外的什么地方.其实, 这都是因为, 我们对它的不了解.
    2014-10-10
  • JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)

    JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)

    这篇文章主要介绍了JavaScript charCodeAt方法入门实例,charCodeAt方法用于取得指定位置字符的Unicode编码,需要的朋友可以参考下
    2014-10-10
  • 详解JavaScript中的变量命名规范

    详解JavaScript中的变量命名规范

    程序员三大难题:变量命名、缓存失效、循环边界。这篇文章主要为大家介绍了JavaScript中的变量命名规范,感兴趣的小伙伴可以跟随小编一起学习一下
    2022-12-12
  • Javascript基础_嵌入图像的简单实现

    Javascript基础_嵌入图像的简单实现

    下面小编就为大家带来一篇Javascript 基础_嵌入图像的简单实现。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • js中top/parent/frame概述及案例应用

    js中top/parent/frame概述及案例应用

    top:永远指分割窗口最高层次的浏览器窗口;parent:包含当前分割窗口的父窗口,本文将围绕js中top、parent、frame进行讲述及他们的应用案例
    2013-02-02
  • Javascript MD4

    Javascript MD4

    Javascript MD4...
    2006-12-12
  • 浅谈js基本数据类型和typeof

    浅谈js基本数据类型和typeof

    下面小编就为大家带来一篇浅谈js基本数据类型和typeof。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • js 使用form表单select类实现级联菜单效果

    js 使用form表单select类实现级联菜单效果

    本文介绍javascript使用html中form表单中的select类实现级联菜单效果,需要的朋友可以了解下
    2012-12-12

最新评论