JavaScript 基本功--面试宝典

JavaScript数据类型

JavaScript中有哪些基本数据类型

undefined、null、number、string、boolean、symbol(es6中新增)
为啥没有object、array、function？他们都属于复杂的数据类型。看起来有点咬文嚼字。

typeof 操做符对各个数据类型的操做结果

string-------------------------string
number-------------------------number
boolean------------------------boolean
function-----------------------function
undefined----------------------undefined
null---------------------------object （null值表示一个空对象指针）
array--------------------------object
object-------------------------object
所以，有些时候typeof并不能准确的判断某个变量的数据类型。

如何区分null和undefined

经过上边能够看出，使用typeof就能够判断区null和undefined了。
还能够经过null === undefined这种方式来判断。

如何准确的判断一个变量的数据类型

JavaScript 中全部变量均可以看成对象使用，除了 null 和 undefined 两个例外。因此咱们可使用对象原型链上的toString方法来将一个变量转化成字符串，而后区分他们的类型。
Object.prototype.toString.call(*);示例：

Object.prototype.toString.call(null)           //  "[object Null]"
Object.prototype.toString.call(undefined)      //  "[object Undefined]"

*在IE8中二者结果都为 "[object Object]"
所以，咱们也能够用这个方法来区分null和undefined

对象建立和使用

建立对象

var obj1 = {x:1,'long name':2};
var obj2 = new Object();
var obj3 = Object.create(obj2);

访问对象属性

obj1.x                // 1
obj1["long name"]     // 2 注意，若是属性名有空格或者中划线什么的就只能使用这种方式了

删除对象属性

delete obj1.x         // 删除对象属性的惟一方法是delete

继承与原型链

前边咱们说了，能够认为 JavaScript 中万物皆对象。每一个对象都有一个私有 Prototype。它持有一个链接到另外一个称为其 prototype 对象（原型对象）的连接。该 prototype 对象又具备一个本身的原型，层层向上直到一个对象的原型为 null。
继承
上边建立对象以及能够看到使用 Object.create 能够实现继承。还有可使用Object.prototype来实现继承。示例：

var obj = {a:1}
function P(name){    // 构造函数
    this.name = name
}
P.prototype = obj  // 继承obj
var p = new P('wesley');     // 实例对象
p.a                  // 1

其次，咱们还可使用es6中的新语法class等关键字来实现继承。
原型链
原型链的定义复杂拗口，咱们能够经过 JavaScript 的非标准但许多浏览器实现的属性__proto__来理解原型链。
对象的__proto__属性是该对象的构造函数的prototype属性。基于上边构造函数继承代码：

console.log(p.__proto__ === P.prototype)                       // true
console.log(P.prototype === obj)                               // true
console.log(P.prototype.__proto__ === Object.prototype)        // true
console.log(Object.prototype.__proto__ === null)               // true

做用域与命名空间

若是了解es6的let用法，那么就应该只要 JavaScript 有块级做用域和函数做用域。简单来讲一般咱们使用var建立的变量都属于函数做用域。
什么是块级做用域呢？其实能够简单理解为一对花括号包围的代码块的做用范围内。
JavaScript 中没有显式的命名空间定义，这就意味着全部对象都定义在一个全局共享的命名空间下面。
每次引用一个变量，JavaScript 会向上遍历整个做用域直到找到这个变量为止。 若是到达全局做用域可是这个变量仍未找到，则会抛出 ReferenceError 异常。
隐式的全局变量

foo1 = 1;
var foo2 = 2;   // 若是是在函数内部  就是局部变量
let foo3 = 3;   // 若是是在代码块内  就是局部变量

能够经过以下代码的执行结果来理解let和var

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

若是使用let

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

变量声明提高
var 表达式和 function 声明都将会被提高到当前做用域的顶部。要注意的是 let 表达式并不会被提高。
这也正好能够说明以下代码能够正常执行：

test();
function test(){
    console.log(a)
    var a = 5;
}

能够理解为提高后的代码：

function test(){
  var a;  // 此时a为undefined  因此咱们打印的时候就是undefined了
  console.log(a)
  a = 5;
}
test();

不使用var申明的变量提高示例：

test();
function test(){
  b = 5
}
console.log(b)
// 5

能够理解为提高后：

var b;  // undefined
(function test(){
  b = 5
})()
console.log(b)

闭包

闭包是 JavaScript 一个很是重要的特性，这意味着当前做用域老是可以访问外部做用域中的变量。
能够理解为访问你本不可以访问到的东西，就是一个闭包。示例：

function Counter(start) {
    var count = start;
    return {
        increment: function() {
            count++;
        },

        get: function() {
            return count;
        }
    }
}

var foo = Counter(4);   // 此时若是咱们在外部直接 console.log(count) 是会抛错的
foo.increment();
foo.get(); // 5

这里，Counter 函数返回两个闭包，函数 increment 和函数 get。这两个函数都维持着对 Counter 函数内部做用域的引用。
因此若是须要访问或者说获取Counter中的变量count，只能经过闭包的方式。
关于闭包，有个很经典的例子：

for(var i = 0; i < 10; i++) {
    setTimeout(function() {
        console.log(i);
    }, 1000);
}
// 10个10

*想一想，为何。具体能够看：https://segmentfault.com/a/11...
setTimeout 和 setInterval
因为 JavaScript 是异步的，可使用 setTimeout 和 setInterval 来计划执行函数。
*注意: 定时处理不是 ECMAScript 的标准，它们在 DOM (文档对象模型) 被实现。

function foo() {}
var id = setTimeout(foo, 1000); // 返回一个大于零的数字

当 setTimeout 被调用时，它会返回一个 ID 标识而且计划在未来大约 1000 毫秒后调用 foo 函数。 foo 函数只会被执行一次。因此，一般咱们能够认为被setTimeout执行的函数是会被异步执行的。