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


Posted in Javascript onJuly 26, 2016

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

对象的含义

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

对象有:

属性-------对象的某些特定的性质。

方法-------对象能做的事情。

事件-------能响应发生在对象上的事情。

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

人:

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

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

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

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 相关文章推荐
jquery.simple.tree插件 更简单,兼容性更好的无限树插件
Sep 03 Javascript
基于JQuery的一句话搞定手风琴菜单
Sep 14 Javascript
jQuery实现渐变弹出层和弹出菜单的方法
Feb 20 Javascript
javascript点击按钮实现隐藏显示切换效果
Feb 03 Javascript
如何在JS中实现相互转换XML和JSON
Jul 19 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
Jan 08 Javascript
Angular之指令Directive用法详解
Mar 01 Javascript
vue引入jq插件的实例讲解
Sep 12 Javascript
Angular中管道操作符(|)的使用方法
Dec 15 Javascript
JavaScript字符串转数字的5种方法及遇到的坑
Jul 16 Javascript
解决vue 使用setTimeout,离开当前路由setTimeout未销毁的问题
Jul 21 Javascript
如何在Express4.x中愉快地使用async的方法
Nov 18 Javascript
jQuery仿京东商城楼梯式导航定位菜单
Jul 25 #Javascript
又一枚精彩的弹幕效果jQuery实现
Jul 25 #Javascript
EasyUI加载完Html内容样式渲染完成后显示
Jul 25 #Javascript
前端微信支付js代码
Jul 25 #Javascript
javascript与jquery动态创建html元素示例
Jul 25 #Javascript
jquery siblings获取同辈元素用法实例分析
Jul 25 #Javascript
js动态添加的DIV中的onclick事件简单实例
Jul 25 #Javascript
You might like
PHP脚本数据库功能详解(中)
2006/10/09 PHP
Php output buffering缓存及程序缓存深入解析
2013/07/15 PHP
php 过滤英文标点符号及过滤中文标点符号代码
2014/06/12 PHP
Zend Framework入门教程之Zend_Db数据库操作详解
2016/12/08 PHP
Laravel网站打开速度优化的方法汇总
2017/07/16 PHP
原生JS实现Ajax通过POST方式与PHP进行交互的方法示例
2018/05/12 PHP
JavaScript TO HTML 转换
2006/06/26 Javascript
Exjs 入门篇
2010/04/07 Javascript
jquery中dom操作和事件的实例学习-表单验证
2011/11/30 Javascript
JS操作CSS随机改变网页背景实现思路
2014/03/10 Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
2015/09/07 Javascript
浅谈JavaScript的内置对象和浏览器对象
2016/06/03 Javascript
JavaScript实现邮箱地址自动匹配功能代码
2016/11/28 Javascript
使用Angular缓存父页面数据的方法
2017/01/03 Javascript
关于vue.js组件数据流的问题
2017/07/26 Javascript
谈谈vue中mixin的一点理解
2017/12/12 Javascript
Angular动态绑定样式及改变UI框架样式的方法小结
2018/09/03 Javascript
vue实现多个元素或多个组件之间动画效果
2018/09/25 Javascript
vue里如何主动销毁keep-alive缓存的组件
2019/03/21 Javascript
javascript 对象 与 prototype 原型用法实例分析
2019/11/11 Javascript
基于MATLAB和Python实现MFCC特征参数提取
2019/08/13 Python
python函数修饰符@的使用方法解析
2019/09/02 Python
联想美国官方商城:Lenovo美国
2017/06/19 全球购物
水产养殖学应届生求职信
2013/09/29 职场文书
挂科检讨书范文
2014/02/20 职场文书
广告语设计及教案
2014/03/21 职场文书
先进员工获奖感言
2014/08/14 职场文书
心得体会的写法
2014/09/05 职场文书
优秀班集体申报材料
2014/12/25 职场文书
2015年乡镇统计工作总结
2015/04/22 职场文书
从严治党主题教育活动总结
2015/05/07 职场文书
就业证明函
2015/06/17 职场文书
2016年基层党组织创先争优承诺书
2016/03/25 职场文书
2019年冬至:天冷暖人心的问候祝福语大全
2019/12/20 职场文书
如何利用js在两个html窗口间通信
2021/04/27 Javascript
Jupyter notebook 更改文件打开的默认路径操作
2021/05/21 Python