最近在复习，学高阶的内容有点吃力，分析了一下，觉得有必要把基础在过一遍，所以刷的基础网课，顺便记录一下笔记。
JavaScript 三大组成部分 ECMAScriptDOM：文档对象模型BOM：浏览器对象模型 ECMAScript 发展历史ECMAScript 包含内容：JS 中的数据类型及相关操作，流程控制，运算符及相关运算……块级作用域：花括号括起来的区域就是一段作用域
if(true){ let a = 1; console.log(a); // 1 } console.log(a); // Uncaught ReferenceError: a is not defined var（变量）let（变量）const（常量）var 可以重复声明同一作用域下不能重复声明声明的时候就要赋值，不能重复声明全局作用域 和 函数作用域全局作用域 和 块级作用域全局作用域 和 块级作用域会进行预解析（变量提升）不进行预解析不进行预解析MDN：解构赋值
一般来说，可迭代的对象都有解构赋值的写法。
// 对象的解构赋值 let obj = { a: 1, b: 2, c: 3 }; let {a,c} = obj; // 把 obj 中的 a 和 c 解构出来 console.log(a,c); // 数组的结构 let arr = [1,2,3]; let [a,b,c] = arr; console.log(a,b,c);对象解构：变量名 和 属性名 要对应
数组解构：变量名 和 值索引对应
// 交换两个数 let a = 0 ; let b = 1; [b,a] = [a,b]; console.log(a,b); // 1 0MDN：展开语法
// 展开运算符：数组 let arr = [1,2,3,4,5]; let arr2 = ["a",...arr,"b","c"]; // 把 arr 中的数据放入 arr2 中 console.log(arr2); // ["a",1,2,3,4,5,"b","c"] // 剩余参数 let arr3 = [1,2,3,4,5]; let [a,...b] = arr3; console.log(a); // 1 console.log(b); // (4) [2, 3, 4, 5] // 展开运算符：对象 let obj = { a: 1, b: 2 }; let obj2 = { ...obj, c: 3, d: 4 }; // 对象的展开 console.log(obj2); // 剩余参数，解构剩余的东西 let {a,...d} = obj2; console.log(a,d);Q：如何复制一个对象，并且互相之间没有影响（前提：知道对象之间有传递地址的问题）。
如果想复制一个对象，并且跟原先的对象没有影响可以这样
let obj = { a: 1, b: 2, }; let obj2 = { ...obj }; // 把 obj 里的数据解构出来，并建一个新的对象 obj2.a = 3; // 修改新对象，旧的对象不会变化 console.log("obj :>>", obj); console.log("obj2 :>>", obj2);MDN：Set 手册
set 是一个独特的数据结构，元素唯一，可以用来去重。
构造函数：用来构建某一类型的对象 用构造函数构造对象的过程叫做：对象的实例化
// 数组去重 let arr = [1,2,3,4,1,3,5,2,"c"]; let data = new Set(arr); console.log(data);常用方法整理：
set 常用方法返回值用途set.size正整数数值的个数set.clear()undefined清空所有值set.delete(val)布尔值删掉某个元素set.add(val)set 对象本身添加某个数组set.has(val)布尔值是否包含某个值MDN：Map 手册
常用方法整理：
map 常用方法返回值用途map.size()正整数数值的个数map.get()值获取某一项值map.set()map 对象本身添加map.clear()undefined清空所有值map.delete(val)布尔值删掉某个元素map.has(val)布尔值是否包含某个值MDN：箭头函数
箭头函数其实就是函数的简写
// 没有参数和两个参数，形参都需要加括号 let fn = () => {}; let fn2 = (val1, val2) => { val1 + val2; }; // 一个参数可以省略括号，返回语句有一条，可以不写花括号 let fn1 = val => val * 2;原函数的不定参有 arguments 箭头函数可以用 ...arg ，也叫 rest 参数，剩余参数。
箭头函数本身没有 this ，调用箭头函数，指向的是其声明时，所在的作用域的 this
document.onclick = function(){ let fn = ()=>{ console.log(this); // #document }; // function fn(){ // console.log(this); // windows // } fn(); }; // 箭头 this 指向，箭头函数定义时所在的作用域的this let fn; let fn2 = function(){ console.log(this); // body fn = ()=>{ console.log(this); // body } } fn2 = fn2.bind(document.body) fn2(); fn();原来的函数，如果希望有默认值，可以这么写
function fn(a,b) { a = a || 0; // 这样写有个问题，就是别人传递个 0，就不对了。 b = b || 1; a = (typeof(a) === 'undefined') ? 0 : a; // 改进的写法 }有了箭头函数，就可以直接在形参里赋默认值了。
// 箭头函数希望有个默认值 let fn = (nub = 10, nub2 = 9) => { console.log(nub + nub2); }; fn();MDN：Array
把一个类数组转换成真正的数组
转换成数组也可以用展开运算符 [...arr]
返回值：转换之后的新数组
arr.forEach()，注意哪些方法是对象下的方法，那些是构造函数下的方法
let datas = { 0: "a", 1: "b", 2: "c", length: 3 }; // datas = Array.from(datas); datas = Array.from(datas,function(item,index){ console.log(item,index,this); return item.toUpperCase(); },document); console.log(datas);也是转换成数组
Array.of("1", "2") // (2) ["1", "2"]判断是否是数组
let datas = { 0: "a", 1: "b", 2: "c", length: 3 }; console.log(Array.isArray(datas)); // false datas = Array.from(datas); console.log(Array.isArray(datas)); // true查找数组中满足要求的第一个元素的值
let arr = [1,2,5,6]; let val = arr.find((item)=>{ return item >= 5; }); console.log(val); // 5查找数组中满足要求的第一个元素的索引
let arr = [1,2,5,6]; let index = arr.findIndex((item)=>{ return item >= 5; }); console.log(index); // 2数组扁平化，参数添加 depth 深度，
let arr = [ [1,2], [3,4], [ [6,7], [ [8], [9,10] ] ] ]; console.log(arr.flat(Infinity)); // (9) [1, 2, 3, 4, 6, 7, 8, 9, 10]方法首先使用映射函数映射每个元素，然后将结果压缩成一个新数组。它与 map 和 深度值1的 flat 几乎相同，但 flatMap 通常在合并成一种方法的效率稍微高一些
Array arr.fill(value[, start[, end]]);
用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引
参数：用来填充数组元素的值。可选参数： start 起始索引，默认值为0。end 终止索引，默认值为 arr.length作用：操作 node 二进制数据 buffer
Boolean arr.includes(valueToFind[, fromIndex])
判断数组中是否包含一个指定的值
参数：valueToFind 需要查找的值
可选参数：从 fromIndex 处开始向后查找
返回值：true 代表数组中包含 valueToFind， false 代表数组中不包含 fromIndex
MDN：字符串手册
Boolean str.includes(valueToFind[, fromIndex]) 判断字符串是否包含一个指定的值
详细： 参考数组的 includes
Boolean str.endsWith(searchString[, length]) 判断当前字符串是否是以另外一个给定的子字符串“结尾”
参数 searchString：要搜索的子字符串。 可选参数 length：作为 str 的长度。默认值为 str.length 返回值：如果传入的子字符串在搜索字符串的末尾则返回true；否则将返回 false。Boolean str.startsWith(searchString[, position]) 判断当前字符串是否以另外一个给定的子字符串开头
参数 searchString：要搜索的子字符串。 可选参数 position：在 str 中搜索 searchString 的开始位置，默认值为 0，也就是真正的字符串开头处。 返回值：如果传入的子字符串在搜索字符串的开始则返回true；否则将返回 false。String str.repeat(count) 构造并返回一个新字符串，该字符串包含被连接在一起的指定数量的字符串的副本
参数
count：介于0和正无穷大之间的整数。表示在新构造的字符串中重复了多少遍原字符串返回值：生成的新字符串
模板字面量 是允许嵌入表达式的字符串字面量。你可以使用多行字符串和字符串插值功能。它们在ES2015规范的先前版本中被称为“模板字符串”。
let name = "LEO"; let age = 40; let gender = "男"; // 原来的写法 //let str = '姓名：' + name + '，年龄：' + age + '岁，性别：男'; // 模板字符串 let str = `姓名：${name}， 年龄：${age}岁， 性别：${gender}`; console.log(str);插值表达式：${}
MDN：Object
当然可以通过展开运算符来做
let obj = { a: 1, b: 2 }; let obj2 = { c: 3, d: 4 }; let obj3 = Object.assign({},obj,obj2); // 合并对象 console.log(obj,obj2,obj3);Boolean Object.is(value1, value2) 判断两个值是否是相同的值。
Object.is() 方法判断两个值是否为同一个值。如果满足以下条件则两个值相等:
两个值都是 undefined两个值都是 null两个值都是 true 或者都是 false两个值是由相同个数的字符按照相同的顺序组成的字符串两个值指向同一个对象两个值都是数字并且 都是正零 +0都是负零 -0都是 NaN或都是非零而且非 NaN 且为同一个值 console.log(+0 === -0); // true console.log(Object.is(+0,-0)); // false把 ES6 转换成 ES5，处理兼容问题。
babel 使用 Babel 是一个 JavaScript 编译器手册地址 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Document</title> <script src="babel.min.js"></script> </head> <body> <script type="text/babel"> let name = "LEO"; let age = 40; let gender = "男"; let str = `姓名：${name}， 年龄：${age}岁， 性别：${gender}`; console.log(str); let arr = [1, 2, 3]; let val = arr.find((item) => { return item > 1; }); console.log(val); </script> </body> </html>运行上面的网页，查看编译好的代码。
如果在浏览器里直接引babel 的话，会弹出警告： You are using the in-browser Babel transformer. Be sure to precompile your scripts for production - https://babeljs.io/docs/setup/，以后学到 Node 和 WebPack 打包的时候会理解。
