JavaScript易错知识点整理

前言

本文是我学习JavaScript过程中收集与整理的一些易错知识点，将分别从变量作用域，类型比较，this指向，函数参数，闭包问题及对象拷贝与赋值这6个方面进行由浅入深的介绍和讲解，其中也涉及了一些ES6的知识点。

JavaScript知识点

1.变量作用域

var a = 1;function test() { var a = 2; console.log(a); // 2}test();

上方的函数作用域中声明并赋值了a，且在console之上，所以遵循就近原则输出a等于2。

var a = 1;function test2() { console.log(a); // undefined var a = 2;}test2();

上方的函数作用域中虽然声明并赋值了a，但位于console之下，a变量被提升，输出时已声明但尚未被赋值，所以输出“undefined”。

var a = 1;function test3() { console.log(a); // 1 a = 2;}test3();

上方的函数作用域中a被重新赋值，未被重新声明，且位于console之下，所以输出全局作用域中的a。

let b = 1;function test4() { console.log(b); // b is not defined let b = 2;}test4();

上方函数作用域中使用了ES6的let重新声明了变量b，而let不同于var其不存在变量提升的功能，所以输出报错“b is not defined”。

function test5() { let a = 1; {  let a = 2; } console.log(a); // 1}test5();

上方的函数作用域中用let声明了a为1，并在块级作用域中声明了a为2，因为console并不在函数内的块级作用域中，所以输出1。

2.类型比较

var arr = [], arr2 = [1];console.log(arr === arr2); // false

上方两个不同的数组比较，console为false。

var arr = [], arr2 = [];console.log(arr === arr2); // false

上方两个相同的数组比较，因为数组与数组比较恒为false，所以console为false。

var arr = [], arr2 = {};console.log(typeof(arr) === typeof(arr2)); // true

上方利用typeof比较数组和对象，因为typeof获取NULL、数组、对象的类型都为object，所以console为true。

var arr = [];console.log(arr instanceof Object); // trueconsole.log(arr instanceof Array); // true

上方利用instanceof判断一个变量是否属于某个对象的实例，因为在JavaScript中数组也是对象的一种，所以两个console都为true。

3.this指向

var obj = { name: 'xiaoming', getName: function () {  return this.name }};console.log(obj.getName()); // 'xiaoming'

上方对象方法中的this指向对象本身，所以输出”xiaoming”。

var obj = { myName: 'xiaoming', getName: function () {  return this.myName }};var nameFn = obj.getName;console.log(nameFn()); // undefined