前端实操类--看到怀疑人生

数据类型

{}=={}    //false
[] == []   // false
null == null    //true       
null === null   //true      
null == 0  //false  
null == undefined   //true    
null === undefined   //false
NaN == NaN    //false   

声明变量

看下面一段代码

        console.log(aa);
        var aa = 2;
        console.log(aa1);

aa1从未定义过，打印结果会是什么？
结果： undefined、Uncaught ReferenceError: aa1 is not defined
为什么会这样呢？这里就涉及到了变量提升。
这是一个相对简单但又容易踩坑的地方。在ES6之前，所谓的变量提升即 JS会将所有的变量和函数声明移动到它所在作用域的最前面。这里有两个重要的信息：
（1）只将变量或函数的声明提前，而赋值并未被提前
（2）只提前到变量或函数所在作用域的最前面，而不是全局作用域的最前面
所以js是这样操作的：

var aa;
console.log(aa);
aa = 2;
console.log(aa1);

知道了这个再看下面就清晰了吧：

console.log(a)  // ReferenceError: a is not defined 
(function() {
  console.log(a);  // undefined
  say();

  var a = 10;
  function say() {
    var b = 15;
    console.log(a + b);//NaN
  }
  console.log(a);  // 10
  say();  // 25
})()

再来看一个

(function() {
 
 var a = b = 5;
})();

console.log(b);//5
console.log(a); //a is not defined

这个问题的诀窍是，这里有两个变量声明，但 a 使用关键字var声明的。代表它是一个函数的局部变量。与此相反，b 变成了全局变量。

这个问题的另一个诀窍是，它没有使用严格模式 (‘use strict'😉。如果启用了严格模式，代码就会引发ReferenceError的错误：B没有定义（b is not defined）。请记住，严格模式，则需要明确指定，才能实现全局变量声明。比如，你应该写：

(function() {
 
 var a = window.b = 5;
})();

console.log(b);//5
console.log(a); //a is not defined

promise

console.log('out-1');
var promise1 = new Promise(function(resolve, reject) {
  console.log('in-1')
  setTimeout(function() {
    resolve('resolve');
  }, 300);
});

promise1.then(function(value) {
  console.log(value);
});

console.log('out-2');
//打印顺序
> "out-1"  
> "in-1"  
> "out-2"  
> "resolve"

var promise1 = new Promise(function(resolve, reject) {
  console.log('in-1');
    resolve('resolve');
});
console.log('out-1');
promise1.then(function(value) {
  console.log(value);
});

  setTimeout(function() {
   console.log('out-2');
  }, 0);

console.log('out-3');
//打印顺序：
> "in-1"
> "out-1"
> "out-3"
> "resolve"
> "out-2"

Object

var a = {};
var b = {key:'b'};
var c = {key:'c'};
var d = [1,2,3,4];
var e = [2,3,4];

a[b] = 123;
console.log(a); // {[object Object]: 123}
a[c] = 456;
console.log(a); //{[object Object]: 456}
a[d] = 333;
console.log(a); //{[object Object]: 456, 1,2,3,4: 333}
a[e] = 444;
console.log(a)  // {[object Object]: 456, 1,2,3,4: 333, 2,3,4: 444}

console.log(a[b]);  // 456
console.log(a[c]);  //456
console.log(a[d]);  //333
console.log(a[e]);  //444

this指向问题：

var name = 'the window';
var obj = {
    name:'the object',
    getName:function(){
        return this.name;
    }
}

console.log(obj.getName()); //the object

var fun = obj.getName;

console.log(fun()); //the window

如果说上面的你清楚了，那么继续往下看：

　　var name = "The Window";

　　var object = {
　　　　name : "My Object",

　　　　getNameFunc : function(){
　　　　　　return function(){
　　　　　　　　return this.name;
　　　　　　};

　　　　}

　　};

　　alert(object.getNameFunc()());  //The Window

　　var name = "The Window";

　　var object = {
　　　　name : "My Object",

　　　　getNameFunc : function(){
　　　　　　var that = this;
　　　　　　return function(){
　　　　　　　　return that.name;
　　　　　　};

　　　　}

　　};

　　alert(object.getNameFunc()());  //My Object