主题:理解对象,创建对象。

小明是一名程序猿,也是一条单身狗!他常常自嘲:每天都会有很多对象,但却没有女朋友!

多么痛的领悟。哈哈,目前比较流行的编程语言都是面向对象的语言(Object-Oriented)。而我们的JavaScript也是面向对象的,尽管它比较特殊。JavaScript中没有类这个概念,每个对象都是基于一个引用类型创建的。这个引用类型可以是前几节说到的原生类型,也可以是开发人员自定义的类型。

对象中可以有属性、方法,创建时赋予一些特征值来定义对象的行为。ECMA-262把对象定义为:“无序属性的集合,其属性可以包含基本值、对象或函数”

 var person = new Object();
person.name = "xuchaoi";
person.age = 24;
person.printName = function() {
console.log(this.name);
};

事实上,我们更喜欢这样创建一个对象:

 var person = {
name: "xuchaoi",
age: 24,
printName: function() {
console.log(this.name);
}
};

在ECMAScript5中还为我们提供了Object.defineProperty()方法去修改对象属性默认的特性,有兴趣自行了解吧,一般也用不到!

人类总是“懒惰”的!日常中我们的程序可能会写很对对象,这其中就有很多对象是差不多的。既然差不多,为什么要重复写呢?这样就出现了一个概念,工厂模式!所谓工厂模式,就是一种设计模式(废话...),抽象创建对象的过程(疑惑...)。在JavaScript中,我们通过函数来封装创建(一类)对象的细节,这样就可以通过这个函数创建很多差不多的对象啦,这个函数就像一个工厂一样(明白了...)。补充:这里会比较多的用到this,后面会单独详细的讲解。这里可以先这么理解:在全局函数中,this指向window。函数被某个对象调用,函数中的this就指向那个对象。匿名函数中的this指向window。

 function createPerson(name, age) {
var person = {
name: name,
age: age,
printName: function() {
console.log(this.name);
}
};
return person;
}
var person1 = createPerson("xuchaoi", 24); //*补充:person1.constructor = Object
var person2 = createPerson("xiaoming", 25); //*constructor属性:构造函数。

这里运用createPerson()函数创建对象很方便。但存在一个问题,就是新产生的对象的constructor属性(构造函数)都指向了Function,而不是person。打个比方的说,函数createPerson就像一个厂房把构造person的机器关在了里面,我们无法知道构造机器是什么样的。为了识别这些机器(识别对象),出现了一个新的方式:构造函数模式。

 function Person(name, age) {
this.name = name;
this.age = age;
this.printName = function() {
console.log(this.name);
}
} //构造函数的特点:1.函数名首字母大写;2.属性和方法赋给了this对象;3.没有return语句
var person1 = new Person("xuchaoi", 24); //用构造函数创建实例时,用new这个关键字
var person2 = new Person("xiaoming", 25); //person2.constructor === Person => true

这时,“懒惰”的人又说了,person1和person2重复创建了Person的printName函数...

 person1.printName === person2.printName; // false

好吧,那我把构造函数中的函数单独拎出来!

function Person(name, age) {
this.name = name;
this.age = age;
this.printName = printName;
}
function printName() {
console.log(this.name)
}
var person1 = new Person("xuchaoi", 24);
var person2 = new Person("xiaoming", 25);

这样完美了吧! NO NO NO,那要是构造函数中的方法很多怎么办?那岂不是全局window下有好多像printName()这样的函数!这样的话就丝毫没有封装性(很高大上的思想)可言了。这时,便出现了一种传说中的原型模式!

下节再说,工作喽 ─=≡Σ(((つ•̀ω•́)つ

回归JavaScript基础(九)的更多相关文章

  1. 回归JavaScript基础(六)

    主题:引用类型Date.RegExp的介绍. 上节主要主要介绍了Object.Array引用类型.这节将继续为大家介绍引用类型,并对书中的一些知识点进行总结与归纳,也借此巩固自己对JavaScript ...

  2. 回归JavaScript基础(一)

    主题:JavaScript简介. 一.JavaScript的起源 JavaScript诞生于1995年.当时,它的主要作用是处理一些输入验证操作.之前的话,都是把表单数据发送到服务器端,然后再去判断有 ...

  3. 回归JavaScript基础(十)

    主题:创建对象 原型模式 JavaScript中的每个对象都有一个prototype属性(原型属性),这个属性是一个指针,指向一个对象,而这个对象可以由一些属性和方法组成.被指向的对象,可以是多个对象 ...

  4. 回归JavaScript基础(八)

    主题:引用类型包装类.单体内置对象的介绍. 对于我们开发人员来说,JavaScript有种引用类型一定很陌生!那就是基本包装类型:Boolean.Number和String.这也不是我们的错,主要这些 ...

  5. 回归JavaScript基础(七)

    主题:引用类型Function的介绍. 今天首先说的就是Function类型.下面就是定义函数的两种方法,第一种使用函数声明语法定义,第二种使用函数表达式定义.这两种定义函数的方式几乎没有什么区别. ...

  6. 回归JavaScript基础(五)

    主题:介绍引用类型Object.Array. 在上一章中,作者就在说变量的值的时候,提到过引用类型这个概念.JavaScript中存在基本类型和引用类型,其中引用类型很重要,这里有许多我们需要注意的东 ...

  7. 回归JavaScript基础(四)

    主题:JavaScript变量.作用域和内存问题 JavaScript的变量和别的语言比起来是与众不同的.说道变量,不得不谈他的作用域.同很多语言一样,JavaScript开发者也不用担心开发中内存的 ...

  8. 回归JavaScript基础(三)

    主题:JavaScript基本概念. 任何语言的核心必然会描述这门语言最基本的工作原理.这部分内容对我们来说,读起来很乏味,甚至会产生困意,但这部分内容却是重要的!我有幸拜读<JavaScrip ...

  9. 回归JavaScript基础(二)

    主题:在HTML中使用JavaScript. 要想把JavaScript放到网页中,就必须涉及到Web的核心语言HTML.向HTML页面中插入JavaScript的主要方法,就是使用<scrip ...

随机推荐

  1. [转]Elasticsearch Java API总汇

    http://blog.csdn.net/changong28/article/details/38445805#comments 3.1 集群的连接 3.1.1 作为Elasticsearch节点 ...

  2. 数据库学习---SQL基础(二)

    数据库学习---SQL基础(一) 数据库学习---SQL基础(二) 数据库学习---SQL基础(三) 上篇复习的sql的增删改查,and ,or ,>=, <=,!=等逻辑运算符,还有in ...

  3. java-forkjoin框架的使用

    ForkJoin是Java7提供的原生多线程并行处理框架,其基本思想是将大任务分割成小任务,最后将小任务聚合起来得到结果.fork是分解的意思, join是收集的意思. 它非常类似于HADOOP提供的 ...

  4. mysql RC下不存在则插入

    mysql版本:5.7 目的:在RC下,name列上仅有key索引,并发插入name时不出现重复数据 RC不加gap lock,并且复合select语句是不加锁的快照读,导致两个事务同时进行都可插入, ...

  5. Vue前端框架面试问题

    1.active-class是哪个组件的属性?嵌套路由怎么定义? 答:vue-router模块的router-link组件. 2.怎么定义vue-router的动态路由?怎么获取传过来的动态参数? 答 ...

  6. ibatis Dynamic总结(ibatis使用安全的拼接语句,动态查询)

    ibatis中使用安全的拼接语句,动态查询,ibatis比JDBC的优势之一,安全高效 说明文字在注释中 一.引入 一个小例子  <select id="selectAllProduc ...

  7. redis实战笔记(3)-第3章 Redis命令

    第3章 Redis命令   本章主要内容 字符串命令. 列表命令和集合命令 散列命令和有序集合命令 发布命令与订阅命令 其他命令   在每个不同的数据类型的章节里, 展示的都是该数据类型所独有的. 最 ...

  8. Hadoop/Spark生态圈里的新气象

    令人惊讶的是,Hadoop在短短一年的时间里被重新定义.让我们看看这个火爆生态圈的所有主要部分,以及它们各自具有的意义. 对于Hadoop你需要了解的最重要的事情就是 ,它不再是原来的Hadoop. ...

  9. clientX/Y pageX/Y offsetX/Y layerX/Y screenX/Y clientHeight innerWidth...

    关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种 event.clientX/Y event.pageX/Y event.offsetX/Y event.layerX/Y event.sc ...

  10. Golang 并发Groutine实例解读(一)

    Go语言的并发和并行 不知道你有没有注意到一个现象,还是这段代码,如果我跑在两个goroutines里面的话: var quit chan int = make(chan int) func loop ...