目录

• 1. JavaScript简介
  • 1.1. ECMAScript
  • 1.2. 文档对象模型(DOM)
  • 1.3. 浏览器对象模型(BOM)
• 2. 在 HTML中使用JavaScript
• 3. 基本概念
  • 3.1. 语法
    • 3.1.1. 区分大小写
    • 3.1.2. 标识符
• 4. 引用类型
  • 4.1. Array类型
    • 4.1.1. 转换方法
    • 4.1.2. 栈方法
    • 4.1.3. 队列方法
    • 4.1.4. 重排序方法
    • 4.1.5. 操作方法
    • 4.1.6. 位置方法
    • 4.1.7. 迭代方法
    • 4.1.8. 归并方法
• 5. 面向对象的程序设计
  • 5.1. 理解对象
    • 5.1.1. 属性类型

1. JavaScript简介

一个完整的JavaScript实现应该由下列三个不同的部分组成:

• ECMAScript,由ECMA-262定义,提供核心语言功能;
• 文档对象模型(DOM),提供访问和操作网页内容的方法和接口;
• 浏览器对象模型(BOM),提供与浏览器交互的方法和接口。

1.1. ECMAScript

ECMAScript和Web浏览器没有依赖关系,这门语言本身不包括输入和输出定义,我们常见的浏览器只是ECMAScript实现可能的宿主环境之一。

1.2. 文档对象模型(DOM)

文档对象模型是针对XML但经过扩展用于HTML的应用程序编程接口。DOM把整个页面映射为一个多层节点结构。

1.3. 浏览器对象模型(BOM)

从根本上讲,BOM只处理浏览器窗口和框架;但人们习惯上也把所有针对浏览器的JavaScript扩展算作BOM的一部分,例如:

• 弹出新浏览器窗口的功能;
• 移动、缩放和关闭浏览器窗口的功能;
• 提供浏览器详细信息的navigator对象;
• 提供浏览器所加载页面的详细信息的location对象;
• 提供用户显示器分辨率详细信息的screen对象;
• 对cookies的支持;
• 像XMLHttpRequst和IE的ActiveXObject这样的自定义对象。

2. 在 HTML中使用JavaScript

略

3. 基本概念

3.1. 语法

ECMAScript的语法大量借鉴了C以及其他类C语言,例如Java和Perl的语法。

3.1.1. 区分大小写

ECMAScript中的一切(变量、函数名和操作符)都区分大小写。

3.1.2. 标识符

4. 引用类型

4.1. Array类型

4.1.1. 转换方法

• toLocaleString
• toString
• valueOf
• join

4.1.2. 栈方法

• pop+push

4.1.3. 队列方法

• shift+push
• unshift+pop

4.1.4. 重排序方法

• reverse
• sort

4.1.5. 操作方法

• concat
• slice
• splice

4.1.6. 位置方法

• indexOf
• lastIndexOf

4.1.7. 迭代方法

• every
• filter
• forEach
• map
• some

4.1.8. 归并方法

• reduce
• reduceRight

5. 面向对象的程序设计

面向对象的语言有一个标志,那就是它们都有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象。ECMAScript中没有类的概念,因此它的对象也与基于类的语言中的对象有所不同。(ES6之后,这种情况改变了,具体可以参照《阮一峰-ES基础入门》。

ECMA-262把对象定义为:“无序属性的集合,其属性可以包括基本值、对象或者函数”。

我们可以把ECMAScirpt的对象想象成散列表:无非就是一组名值队,其中值可以是数据或函数。每个对象都是基于一个引用类型创建的,这个引用类型可以是第5章中讨论的原生类型,也可以是开发人员定义的类型。

5.1. 理解对象

创建自定义对象,可以:

• 通过创建Object的实例,然后再为它添加属性和方法;
• 对象字面量

5.1.1. 属性类型

ECMA-262第5版在定义只有内部才用的特性(attribute)时,描述了属性(property)的各种特征。这些特性是为了实现JS引擎用的,因此在JS中不能直接访问它们。为了表示特性是内部值,该规范把它们放在了两对方括号中。

ECMAScript中有两种属性:数据属性和访问器属性:

1. 数据属性(包含一个数据值的位置,在这个位置可以读取和写入值)
   • [[Configurable]]:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性,对于直接在对象上定义的属性,默认为true。
   • [[Enumerable]]:表示能否通过for-in循环返回属性,对于直接在对象上定义的属性,默认为true。
   • [[Writable]]:表示是否能够修改属性的值,对于直接在对象上定义的属性,默认为true。
   • [[Value]]:包含这个属性的数据值,默认为undefined。
2. 访问器属性(包含一对getter和setter函数)
   • [[Configurable]]:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为数据属性,对于直接在对象上定义的属性,默认为true。
   • [[Enumerable]]:表示能否通过for-in循环返回属性,对于直接在对象上定义的属性,默认为true。
   • [[Get]]:在读取属性时调用的函数,默认为undefined。
   • [[Set]]:在写入属性时调用的函数,默认为undefined。

非常重要:

要修改属性默认的特性,必须使用ECMAScript5的Object.defineProperty()方法。这个方法接受三个参数:属性所在的对象、属性的名字和一个描述符对象,Vue2.x中双向绑定的一个过程类似:

var Book = {}var name = '';Object.defineProperty(Book, 'name', {  set: function (value) {    name = value;    console.log('你取了一个书名叫做' + value);  },  get: function () {    return '《' + name + '》'  }}) Book.name = 'vue权威指南';  // 你取了一个书名叫做vue权威指南console.log(Book.name);  // 《vue权威指南》