前端JavaScript知识点深入（持续更新）

1. map

es6遍历数组的方法，接收3个参数，分别为currentValue、index、arr

参数：
	currentValue	当前值
	index		当前索引值
	arr			数组本身
应用实例：
 	['1', '2', '3'].map(parseInt)
 	相当于parseInt函数接收.map()方法的前两个参数，即currentValue和index。故输出的是：
 	parseInt('1', 0)	 =>  1
	parseInt('2', 1)  =>  NaN
	parseInt('3', 2)  =>  NaN

拓展：

parseInt(string, radix)

	1.radix只能在0、2~36之间取值，默认值是10，若是其他值则返回NaN；
	2.radix为0、null、undefined时，取默认值；
	3.第一个参数若以0x或0X开头，radix取16；
	4.第一个参数为数值时，转换成字符串再解析;
		parseInt('123abc123')  =>  123
		parseInt(011)  =>  9
		parseInt(0.0000008)  =>  parseInt(8e-7)  =>  parseInt('8e-7')  =>  8

2. reduce

数组方法，相当于一个函数累加器，可接收上一个回调函数的结果，将前一次回调函数返回的结果与当前数据作为回调函数的参数，再次调用回调函数。

参数：
	callback(prevValue, curValue, index, arr)	回调函数
	prevValue	上一个回调的结果
	curValue		当前值
	index		索引值
	arr			数组原始值
	initValue								初始值
应用实例：
	数组去重
	arr.reduce((prev, curr) => {
	prev.indexOf(curr) === -1 && prev.push(curr);
	return prev;
	}, []);

注意：

	空数组使用.reduce()方法会报typeError错误；
	注意第二个参数initValue的使用，可根据实际情况灵活变通，例如这里是数组去重，
	需要一个数组来存储去重后的结果，故initValue=[],若是做累加器，initValue=0等等。
	但数组去重的最常用方法：
	let arr = [1, 2, 3, 3, 4, 2, 5, 1];
	console.log([...new Set(arr)]);

3. 数组未初始化索引bug

看一个例子：

var arr = [0, 1, 2, 3];
arr[10] = 10;
var arr2 = arr.filter(v => v === undefined);
console.log('arr2: ', arr2);
console.log('length: ', arr2.length);

看到这里你是否会认为数组arr最后会是6个undefined呢？其实不是的，最后结果为

arr2: []
length: 0

其实出现这个结果的原因是：这个数组中索引从4-9的位置都未被初始化，数组调用函数时会跳过这些坑，故在使用filter方法时，v只有0,1,2,3,10，它们都不等于undefined，最终返回的arr2是空数组。

4. 深浅拷贝

js中数据类型有两种：基本数据类型（Number/String/Boolean/null/undefined）、复杂数据类型（对象），
基本数据类型存储在栈内存中，复制时重新开辟一块栈空间存储新值；
复杂数据类型数据存储在堆内存中，但是其地址存储在栈内存中，复制时在栈内存开辟一块空间存储新的变量，指向堆内存中的地址还是不变。
浅拷贝：基本数据类型重新开辟栈空间存储新值，复杂数据类型开辟栈空间存储地址，不复制堆内存中的数据；
深拷贝：复杂数据类型，复制栈内存中地址的同时，也复制了堆内存中的变量本身。
例子：

let a = {
    aa: 1,
    bb: {
        cc: 2
    }
};
// 浅拷贝
let b = a;
a.bb.cc = 3;
cosole.log(b.bb.cc); // 3
// 深拷贝
let c = JSON.parse(JSON.stringify(a)));
a.bb.cc = 4;
console.log(c.bb.cc); // 3

5. 标记的模板字符串

const name = 'cwc', age = 18;
const str = `${cwc} is ${age} years old`;
getArguments = (one, two, three) => {
    console.log(one, two, three);
}
this.getArguments(str);

结果：
one：["", “is”, “years old”] 模板字符串中变量之间的字符串，没用则使用空字符串代替
two: “cwc” 第一个变量
three: 18 第二个变量