万物即是对象,这是我看《悟透javascript》第一部分最强烈的印象。接下来我来理一下书中第一部分的脉络。

书中告诉我们,在编程的世界里就是数据和实现的逻辑,接下来讲了在JS中,万物皆是对象,包括函数function本质上也是一种对象。JS虽然也是一种面向对象的语言但是不像C++ ,java等面向对象语言具有类这个概念,书中给出的解释特别有意思。以自然界为例子,类这个概念是我们人类根据自然界的各种生物进行划分提出的概念,自然界本来就没有类这个概念的,有的仅仅只是各种生物进化的对象,所以javascript没有类这个概念显得多么地符合自然变换的规律。既然JS中都是对象,那么JS是如何创建对象的呢?

JS是如何创建对象的?

书中介绍JS创建对象其中的两种方式:一、new 一个函数,之前说过函数是一个对象,new一个函数并把该函数赋值给一个对象,比如 var Obj1 = new function(){......},背后实现的原理便是先创建一个对象,并把这个对象作为this参数从而调用后面的函数;二、JSON(javascript object notation)javascript对象标记法,其实学过python的朋友都知道一种叫做字典的东西,json本质上就是一种字典,里面储存的属性和方法都是用字典的方式来存储,用一对大括号括起来一个空字典,同时也是一个空对象,用逗号分隔开每个属性和方法,用冒号来定义字典内每一个项内容,左侧是key,用来访问右侧的值,比如

var person{

"name": "jack",

"age":"22",

“sayhello":function(){alert("hello world")}

}

除了可以表示对象外,JSON 还可以表示数组,这时用的是方括号[]而不是花括号了{}.我们可以采用person.name也可以采用person[“name”]来获取我们想要的对象数据。

怎样创建一个对象更节省成本?

我们知道创建一个对象肯定是要占据一定的空间和资源的,在JS中也一样,JS每创建完一个对象后便会对每一个对象的数据和函数创建一个副本,这个做法无疑会造成大量的资源浪有些浪费。我们知道对象数据是私有的,每个对象有数据副本是无可厚非的,但是对于函数来说,有时候不同的对象间,可能数据是不同的,但是函数的实现逻辑是一样的,这个时候就会产生很多实现相同逻辑的代码副本,但这并不是我们想要的。那么要解决这个问题有没有什么方法呢?答案当然是有的,书中提到JS提供的两种解决方案:一:在对象外定义唯一的函数体,该函数体保存的数据占据一块空间,在对象定义时,用this指向它,所有对象建立时便都指向这一块空间,也就不再创建副本了。 比如:

function sayHello(){

alert("hello world");

}

function  Person(name){

this.name = name;

this.sayHello= sayHello();

}

var BillGate = new Person("BillGate");

var SteeveJobs = new Person("steeveJobs");

alert(BillGate.sayHello == SteeveJobs.sayHello);//true

二:采用prototype属性,在JS中所有的function类型对象都具有prototype属性,prototype属性本身又是一个对象,可以任意添加属性和方法。对象是可以访问和调用定义在prototype上的属性和方法的,也就是说prototype实现对象属性和方法的访问共享机制,因而方案二如下

function Person( name){

this.name = name;

}

Person.prototype.sayHello = function(){

alert("hello world");

}

var BillGate = new Person("BillGate");

var SteeveJobs = new Person("steeveJobs");

alert(BillGate.sayHello == SteeveJobs.sayHello);//true

prototype属为何性如此神奇,而prototype又是如何实现共享的呢?那么就不得不介绍prototype背后庞大的家族势力类。

神秘PROTOTYPE家族   

    每个对象都有prototype属性,这个我们知道,除了这一点一外,prototype其实还有一个家族,也就是我们常说的原型链。在JS,只有function对象具有prototype属性,除了它以外的对象(object对象除外)只有_proto_属性,所谓的原型链本质上就是每个_proto_这个指针串起来的指针链,链的末尾处是object的prototype属性,值为null。具体可以看一个大神的原型链的文章http://www.cnblogs.com/libin-1/p/5820550.html

说到家族会让我们想到什么?除了巨额的财产,那就是离不开的继承了。在JS中也就是所谓的原型继承,实现的方法就是,让子类的构造函数的propertype属性指向它的父类实例,比如书中的例子

function Person( name){  //基类构造函数

this.name = name;

}

Person.prototype.sayHello = function(){

alert("hello,I am "+this.name );

}

function Employee(name,salary){  //子类构造函数

Person.call(this.name);  //调用基类构造函数

this.salary = salary;

}

Employee.prototype = new Person() //建立一个基类的对象作为子类的原型对象(原型继承)

Employee.prototype.showMoney = funcion(){

alert(this.name+"'s  salary is"+"$"+this.salary);

}

var BillGate = new Person("BillGate");

var SteeveJobs = new Employee("steeveJobs",1234);

BillGate.sayHello();

steeveJobs.sayHello();

steeveJobs.showMoney();

家族每个孩子各有个性,这个也就是我们说的多态,可以通过重写来实现多态性,重写之后的变化只针对特定的对象并不影响原来原型链上的属性和方法。

unction Person( name){

this.name = name;

}

Person.prototype.company = "Banana"

Person.prototype.sayHello = function(){

alert("hello,my company is  "+this.company );

}

var BillGate = new Person("BillGate");

var SteeveJobs = new Person("steeveJobs");

steeveJobs.company = "Apple"

steeveJobs.sayhello = function(){

alert("my company is"+this.company+",Iphone is our product");

}

BillGate.sayHello();//hello,my company is Banana  默认prototype属性

steeveJobs.sayHello();//my company is Apple,Iphone is our product 多态性

既然prototype有如此神奇的魔力,聪明的你一定想到我们是不是可以为我们JS库对象增加一些属性和方法来方便我们日常的工作呢,答案当然是肯定的,现在这个大家族中产生一些非常有名望的家族比如大名顶顶的AJAX,就是通过prototype扩展JS内部的功能。

转载于:https://www.cnblogs.com/meowding/p/7656967.html

JS入门篇-万物皆对象相关推荐

  1. 你还认为JS中万物皆对象?

    经常在国内的各大网站博客上看到一句话,叫做JS中万物皆对象,那是否真是如此? 那么,我们先来捋一捋JS中的数据类型,JS中的数据类型有下面几种 Undefined Null Boolean Numbe ...

  2. js对象:从万物皆对象说起

    经常见很多文章中说:在js中万物皆对象,但真的万物皆对象吗?答案肯定是否定的 先不说概念性的东西,我们随便定义一些变量,然后打印出他们的类型,看如下代码: //先定义一些变量; var iNum = ...

  3. Kotlin入门-万物皆对象,基础类型

    Kotlin说:万物皆对象. 可以说,Kotlin全面的接管了所有类型.一统天下. 即是基础,那就需要,通盘了解.按目录来就行.也有Xmind版本 github地址 本文将从下面几个方面去讲解 数字 ...

  4. javascript”面向对象编程”- 1万物皆对象

    javascript几乎成了如今web开发人员必学必会的一门语言,但很多人却只停在了一些表单验证等基础操作层面上,在面向对象语言大行其道的当下,我们需要去学习javascript的面向对象的知识,以便 ...

  5. python一切皆对象的理解_在 Python 中万物皆对象

    在 Python 中一切都是对象,并且几乎一切都有属性和方法.所有的函数都有一个内置的 __doc__ 属性,它会返回在函数源代码中定义的 doc string:sys 模块是一个对象,它有一个叫作 ...

  6. js入门篇--制作简单闪烁图片

    js入门篇–制作闪烁图片 刚刚学习,大神勿喷,还请多多指点... <body "soccerOnload()" topmargin="0"> //o ...

  7. 理解“万事万物皆对象”

    什么是对象? 对象(Object)是一个应用系统中的用来描述客观事物的实体,是有特定属性和行为(方法)的基本运行单位.是类的一个特殊状态下的实例.对象可以是一个实体.一个名词.一个可以想象为有自己标识 ...

  8. (转)web前端开发分享-css,js入门篇

    关注前端这么多年,没有大的成就,就入门期间积累了不少技巧与心得,跟大家分享一下,不一定都适合每个人,毕竟人与人的教育背景与成长环境心理活动都有差别,但就别人的心得再结合自己的特点,然后探索适合自己的学 ...

  9. Python源码解读之一 万物皆对象(上)

    万物皆对象 初探对象 Python中一切皆对象,在Python的世界里面,所有东西都是对象.整型.字符串.字典.int.str.list.class自定义类都是对象. 像int.str.list等基本 ...

最新文章

  1. tensorflow 1.0 学习:十图详解tensorflow数据读取机制
  2. Consul入门07 - Consul Web界面
  3. bash-shell--高级编程
  4. JavaScript基础03【算数运算符、一元运算符、自增and自减】
  5. win10计算机跑分,鲁大师如何跑分_鲁大师跑分详细教程
  6. 流言终结者- Flutter和RN谁才是更好的跨端开发方案?
  7. html5boder属性,你未必知道的CSS小知识:border属性比你想象的要复杂
  8. 扫描40亿可路由的 IPv4 地址后发现这些打印机的 IPP 端口遭暴露
  9. 被平均(统计平均)的陷阱
  10. python与r语言处理excel数据_【R语言】批量读取Excel数据并合并(升级版)
  11. DataFormatString 的使用
  12. 使用jsoup简单爬取微信公众号一些图片
  13. 常用的14个获取数据的网站。
  14. SkeyeVSS综合安防监控视频云服务使用说明文档
  15. erp仓储管理 java,关于java:ERP仓库管理的操作与设计开源软件诞生20
  16. in-place运算总结
  17. cad怎么画坐标系箭头_AutoCAD2016怎么画箭头 在一条直线上画个箭头方法
  18. 09 | 校招简历投递渠道汇总与对比分析,选对渠道才能事半功倍
  19. 贵州有哪些魅力,为何阿里、华为、腾讯都把数据中心建在贵州?
  20. Android 通过蒲公英pgyer的接口 Service 实现带进度下载App 通知栏显示 在线更新 自动更新Demo

热门文章

  1. java填充多边形_JAVA绘制填充多边形输出文字保存成图片的示例
  2. 〖Python语法进阶篇③〗- 进程的创建与常用方法
  3. PAPR论文阅读笔记2之On the distribution of the peak-to-average power ratio in OFDM signals
  4. 超级计算机——超级算力推动工业仿真加速发展
  5. Java+MySQL 基于ssm的老年人健康饮食管理系统#毕业设计
  6. java 石头剪刀布_Java实现石头剪刀布小游戏
  7. 微信网页提示已停止访问的原因及解决方案
  8. 我从Angular 2转向Vue.js, 也没有选择React
  9. 转载ubuntu最简单显卡驱动与cuda安装
  10. [Android] 文字翻转动画的实现