JavaScript基础 《JavaScript 语言入门教程》笔记

本篇博客是根据《JavaScript 语言入门教程》做的一个简略版笔记，以及补充了重新介绍 JavaScript（JS 教程）的内容方便以后查阅。
非常感谢以上教程文档的贡献者，对我很有帮助。

JavaScript介绍

是一个在宿主环境下运行的脚本语言，任何与外界沟通的机制都是由宿主环境提供的。浏览器是最常见的宿主环境，其他程序中也包含 JavaScript 解释器，如 Adobe Photoshop的 Widget 引擎，Node.js 之类的服务器端环境，NoSQL 数据库、嵌入式计算机，以及包括 GNOME在内的桌面环境等等。

JavaScript 的基本语法

• JavaScript 是大小写敏感的。

• 如果变量只声明没有赋值，则变量的值为undefined（表示无定义）。声明变量时没有写var也是可以的（不建议）。变量没声明就使用会报错。

var a = 1;//变量的声明和赋值
var b;
c // undefined

• JavaScript 是一种动态类型语言，变量的类型没有限制，变量可以随时更改类型。

var a = 1;
a = 'hello';

• 使用var重新声明一个已经存在的变量，是无效的。（不能重复声明变量）

• 变量提升：所有的变量的声明语句，都会被提升到代码的头部。

console.log(a);
var a = 1;

因为存在变量提升，真正运行的是下面的代码。

var a;
console.log(a);
a = 1;

最后的结果是显示undefined，表示变量a已声明，但还未赋值。

• 区块：用大括号，将多个相关的语句组合在一起。区块不构成单独的作用域（大括号里面创建的变量在括号外面也可以用），区块往往用来构成其他更复杂的语法结构，比如for、if、while、function等。

• 标签label：语句的前面有标签，相当于定位符，用于跳转到程序的任意位置。
  常用于跳出循环：

break：如果后面没有标签，就跳过当前的内层循环。后面有了top标签就跳过内外两层循环。

top:
//top标签用于跳出双重循环
  for (var i = 0; i < 3; i++){
    for (var j = 0; j < 3; j++){
      if (i === 1 && j === 1) break top;
      console.log('i=' + i + ', j=' + j);
    }
  }

continue：如果后面没有标签，就直接进入下一轮内层循环，后面有了top标签就进入下一轮的外层循环。

top:
  for (var i = 0; i < 3; i++){
    for (var j = 0; j < 3; j++){
      if (i === 1 && j === 1) continue top;
      console.log('i=' + i + ', j=' + j);
    }
  }

数据类型

准确来说，JavaScript 中的类型应该包括这些：

Number（数字）
String（字符串）
Boolean（布尔）
Symbol（符号）（ES2015 新增）
Object（对象）
Function（函数）
Array（数组）
Date（日期）
RegExp（正则表达式）
null（空）
undefined（未定义）

数值（number）

整数和小数
JavaScript 语言的底层根本没有整数，所有数字都是小数储存的（64位浮点数），简单的法则就是，JavaScript 对15位的十进制数都可以精确处理。

特殊数值：1.正0和负0：一个是+0，一个是-0，是等价的，区别就是64位浮点数表示法的符号位不同。2.NaN。3.Infinity（无穷）

parseInt()将字符串转为整数、进制转换。parseFloat方法用于将一个字符串转为浮点数（十进制）。isFinite方法判断某个值是否为有穷数（Infinity, -Infinity 或 NaN则返回false）。

字符串（string）

length 属性返回长度（可能是不正确的，对于码点在U+10000到U+10FFFF之间的字符，JavaScript 总是认为它们是两个字符（length属性为2））

JavaScript 使用 Unicode 字符集（可在程序中使用 Unicode 码点表示字符，即将字符写成\uxxxx的形式）。（UTF-16编码）

如果长字符串必须分成多行，可以在每一行的尾部使用反斜杠\，或者用+号连接字符串：

var longString = 'Long \
long \
long \
string';

var longString = 'Long '
  + 'long '
  + 'long '
  + 'string';

"Prev \\ Next"
// "Prev \ Next"（字符串的正常内容之中，需要包含反斜杠的处理）

布尔值（boolean）

即true（真）和false（假）

空数组（[]）和空对象（{}）对应的布尔值，都是true。而空字符串（""或’’）对应的布尔值是false。

（false、0、空字符串（""）、NaN、null 和 undefined 被转换为 false）

undefined

表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值。undefined 实际上是一个不允许修改的常量。

null

表示空值，即此处的值为空。

null和undefined的区别：null是一个表示“空”的对象，转为数值时为0；undefined是一个表示"此处无定义"的原始值，转为数值时为NaN（非数字Not a Number）。

对象（object）

各种值组成的集合，是一种无序的复合数据集合，可以简单理解成“名称-值”对（而不是键值对：ES 2015 的映射表（Map），比对象更接近键值对）。
对象的所有键名都是字符串，如果键名是数值，会被自动转为字符串。
对象的每一个键名又称为“属性”（property），它的“键值”可以是任何数据类型。如果一个属性的值为函数，通常把这个属性称为“方法”，它可以像函数那样调用。
读取属性可以用.也可以用["属性名"]

var obj = {
  p1: 1,
  p2: 2,
};

obj.foo = 'Hello';//可以在任意时刻新增属性
obj['bar'] = 'World';

Object.keys(obj);//查看一个对象本身的所有属性
delete obj.foo //delect用于删除对象的属性，删除成功后返回true（无法删除继承的属性）
'p' in obj // 判断属性p是否存在
obj.hasOwnProperty('toString')//判断toString属性是不是对象自身的属性（相对于继承的属性）
//for in 遍历全部属性
for (var i in obj) {
  console.log('键名：', i);
  console.log('键值：', obj[i]);
}
//with操作同一个对象的多个属性时，提供一些书写的方便（不推荐使用）
//必须是当前对象已经存在的属性，否则会创造一个当前作用域的全局变量。
//with区块没有改变作用域，绑定对象不明确，不利于代码的除错和模块化
with (obj) {
  p1 = 4;
  p2 = 5;
}

JavaScript 有三种方法，可以确定一个值到底是什么类型。

• typeof运算符：返回一个值的数据类型，函数返回function，undefined返回undefined（可用来检查一个没有声明的变量，而不报错），对象返回object，null返回object（历史遗留问题）
• instanceof运算符
• Object.prototype.toString方法

函数

JavaScript 语言将函数看作一种值，与其它值（数值、字符串、布尔值等等）地位相同。

function add(x, y) {
  return x + y;
}

// 将函数赋值给一个变量
var operator = add;

// 将函数作为参数和返回值
function a(op){
  return op;
}
a(add)(1, 1)

如果有同名的参数，则取最后出现的那个值。
arguments 对象：包含了函数运行时的所有参数，arguments[0]就是第一个参数，arguments[1]就是第二个参数，以此类推。这个对象只有在函数体内部，才可以使用。修改arguments对象不会影响到实际的函数参数。

闭包

JavaScript 有两种作用域：全局作用域和函数作用域。函数内部可以直接读取全局变量。

如果出于种种原因，需要得到函数内的局部变量。正常情况下，这是办不到的，只有通过变通方法才能实现。那就是在函数的内部，再定义一个函数：

function f1() {
  var n = 999;
  function f2() {
    console.log(n);
  }
  return f2;
}

var result = f1();
result(); // 999

函数f1的返回值就是函数f2，由于f2可以读取f1的内部变量，所以就可以在外部获得f1的内部变量了。

可以把闭包简单理解成“定义在一个函数内部的函数”，闭包最大的特点，就是它可以“记住”诞生的环境，闭包就是将函数内部和函数外部连接起来的一座桥梁。

闭包的最大用处有两个，一个是可以读取函数内部的变量，另一个就是让这些变量始终保持在内存中，即闭包可以使得它诞生环境一直存在：

function createIncrementor(start) {
  return function () {
    return start++;
  };
}

var inc = createIncrementor(5);

inc() // 5
inc() // 6
inc() // 7

原因就在于inc始终在内存中，而inc的存在依赖于createIncrementor，因此也始终在内存中，不会在调用结束后，被垃圾回收机制回收。内存消耗很大，因此不能滥用闭包。

数组

数组属于一种特殊的对象。typeof运算符会返回数组的类型是object。数组的特殊性体现在，它的键名是按次序排列的一组整数（0，1，2…）。

length属性长度。当length属性设为大于数组个数时，读取新增的位置都会返回undefined，数组的长度length是比数组最大索引值多一的数。

for in 遍历数组，in判断数组元素是否存在（和Object一样）。
遍历数组的三个方法：for in、for of、forEach()：

当数组的某个位置是空元素，即两个逗号之间没有任何值，我们称该数组存在空位（hole）。

var a = [1, , 1];
a.length // 3

变量

在一个复合语句中（如 if 控制结构中）使用 var 声明一个变量，那么它的作用域是整个函数（复合语句在函数中）。 但是从 ECMAScript Edition 6 开始将有所不同的， let 和 const 关键字允许你创建块作用域的变量。

自定义对象

每次我们创建一个 Person 对象的时候，我们都在其中创建了两个新的函数对象——如果这个代码可以共享不是更好吗？改进方法：

运算符

指数运算符（**）完成指数运算，前一个运算子是底数，后一个运算子是指数。

avaScript 提供两种相等运算符：==和===。
相等运算符（==）比较两个值是否相等，严格相等运算符（===）比较它们是否为“同一个值”。
如果两个值不是同一类型，严格相等运算符（===）直接返回false，而相等运算符（==）会将它们转换成同一个类型，再用严格相等运算符进行比较。

NaN === NaN  // false
+0 === -0 // true

两个复合类型（对象、数组、函数）的数据比较时，不是比较它们的值是否相等，而是比较它们是否指向同一个地址，严格相等运算符比较的是地址，而大于或小于运算符比较的是值。

严格相等运算符有一个对应的“严格不相等运算符”（!==），它的算法就是先求严格相等运算符的结果，然后返回相反值。

1 !== '1' // true
// 等同于
!(1 === '1')

void运算符的作用是执行一个表达式，然后不返回任何值，或者说返回undefined。

逗号运算符用于对两个表达式求值，并返回后一个表达式的值。

'a', 'b' // "b"

var x = 0;
var y = (x++, 10);
x // 1
y // 10

右结合运算符：=、？:、**

w = x = y = z;
q = a ? b : c ? d : e ? f : g;
//w = (x = (y = z));
//q = a ? b : (c ? d : (e ? f : g));
2 ** 3 ** 2
// 相当于 2 ** (3 ** 2)

数据类型转换

强制转换：
一般用Number()、String()和Boolean()强制转换。

umber方法的参数是对象时，将返回NaN，除非是包含单个数值的数组。
String方法的参数如果是对象，返回一个类型字符串；如果是数组，返回该数组的字符串形式：

Boolean()函数除了以下五个值的转换结果为false，其他的值全部为true。

• undefined
• null
• 0（包含-0和+0）
• NaN
• ‘’（空字符串）

标准库

Object

Object对象的原生方法分成两类：Object本身的方法（又称为“静态方法”）与Object的实例方法。本身的方法 就是直接定义在Object对象的方法，实例方法就是定义在Object原型对象Object.prototype上的方法。它可以被Object实例直接使用。

如果参数为空（或者为undefined和null），Object()返回一个空对象。
obj instanceof Object返回true，就表示obj对象是Object的实例。

Object 的静态方法：
Object.keys方法和Object.getOwnPropertyNames方法都用来遍历对象的属性。一般是一样的，只有涉及不可枚举属性时，才会不一样。Object.keys方法只返回可枚举的属性，Object.getOwnPropertyNames方法还返回不可枚举的属性名。

Object 的实例方法：

Object.prototype.valueOf()：返回当前对象对应的值。
Object.prototype.toString()：返回当前对象对应的字符串形式。

Object.prototype.toLocaleString()：返回当前对象对应的本地字符串形式。主要作用是留出一个接口，让各种不同的对象实现自己版本的toLocaleString，用来返回针对某些地域的特定的值。

Object.prototype.hasOwnProperty()：判断某个属性是否为当前对象自身的属性，还是继承自原型对象的属性。方法接受一个字符串作为参数，返回一个布尔值，表示该实例对象自身是否具有该属性。
Object.prototype.isPrototypeOf()：判断当前对象是否为另一个对象的原型。
Object.prototype.propertyIsEnumerable()：判断某个属性是否可枚举

属性描述对象

JavaScript 提供了一个内部数据结构，用来描述对象的属性，控制它的行为，比如该属性是否可写、可遍历等等。这个内部数据结构称为“属性描述对象”（attributes object）。每个属性都有自己对应的属性描述对象，保存该属性的一些元信息。