《廖雪峰JavaScript-快速入门》笔记

文章内容来源：廖雪峰JavaScript-快速入门

赋值

var x = 1;

注释

// comment
/* comment */

数据类型

Number

JavaScript不区分整数和浮点数，统一用Number表示。

123;
0.456;
1.2345e3;
NaN;
Infinity;

字符串

字符串是以单引号'或双引号"括起来的任意文本。

'Hello ';
"World!";

布尔

一个布尔值只有true、false两种值。

数组

JavaScript的数组能够包括任意数据类型。

[1, 2, 3.14, 'Hello', null, true];

对象

JavaScript的对象是一组由 键-值组成的无序集合，对象的键都是字符串类型，值能够是任意数据类型。

var mi = {
  name: 'YuMi',
  age: 22
}

要获取一个对象的属性，咱们用 对象变量.属性名的方式：

mi.name;
mi.age;

变量名

变量名是大小写英文、数字、 $和 _的组合，且不能用数字开头。

条件判断

JavaScript使用if () { ... } else { ... }来进行条件判断。

循环

for

for(var i = 0; i < arr.length; i++) {
  x = arr[i];
  console.log(x);
}

for...in

for循环的一个变体是 for ... in循环，它能够把一个对象的全部属性依次循环出来：

var mi = {
  name: 'YuMi',
  age: 22
};
for (var key in mi) {
  console.log(key); // 'name', 'age', ...
}

要过滤掉对象继承的属性，用 hasOwnProperty()来实现。

var mi = {
    name: 'YuMi',
    age: 22
};
for (var key in mi) {
  if(mi.hasOwnProperty(key)) {
    console.log(key); // 'name', 'age'
  }
}

for ... in循环能够直接循环出 Array的索引。

var a = ['A', 'B', 'C'];
for (var i in a) {
  // 获得的 i 是 String 而不是 Number 。
  console.log(i); // '0', '1', '2'
  console.log(a[i]); // 'A', 'B', 'C'
}

while/do...while

略。

Map/Set

Map

最新的ES6规范引入了新的数据类型 Map， Map是一组键值对的结构，具备极快的查找速度。

初始化Map须要一个二维数组：

var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);
m.get('Michael'); // 95

或者直接初始化一个空 Map：

var m = new Map(); // 空Map
m.set('Adam', 67); // 添加新的key-value
m.set('Bob', 59);
m.has('Adam'); // 是否存在key 'Adam': true
m.get('Adam'); // 67
m.delete('Adam'); // 删除key 'Adam'
m.get('Adam'); // undefined

屡次对一个 key放入 value，后面的值会把前面的值冲掉。

Set

Set和 Map相似，也是一组 key的集合，但不存储 value。

要建立一个Set，须要提供一个Array做为输入，或者直接建立一个空Set：

var s1 = new Set(); // 空Set
var s2 = new Set([1, 2, 3]); // 含1, 2, 3
s2.add(4);
s2.delete(3);

iterable

为了统一集合类型， ES6标准引入了新的 iterable类型， Array、 Map和 Set都属于 iterable类型。

具备iterable类型的集合能够经过新的for ... of循环来遍历。

for ... in循环因为历史遗留问题，它遍历的其实是对象的属性名称。一个Array数组实际上也是一个对象，它的每一个元素的索引被视为一个属性。

var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
    console.log(x); // '0', '1', '2', 'name'
}

for ... of循环则彻底修复了这些问题，它只循环集合自己的元素：

var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
    console.log(x); // 'A', 'B', 'C'
}

更好的方式是直接使用 iterable内置的 forEach方法，它接收一个函数，每次迭代就自动回调该函数：

var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
    // element: 指向当前元素的值
    // index: 指向当前索引
    // array: 指向Array对象自己
    console.log(element + ', index = ' + index);
});

Set与 Array相似，但 Set没有索引，所以回调函数的前两个参数都是元素自己：

var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
    console.log(element);
});

Map的回调函数参数依次为 value、 key和 map自己：

var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
    console.log(value);
});

---

我的静态博客：

• 气泡的前端日记： https://rheabubbles.github.io