面试总结篇(一)

1、this的指向问题：

(1) 定义的function中的this指向的是window

如：

function aaa(){

console.log(this) ----->window

}

或者是内嵌的函数：

var aaa={

vvv:function(){

function bbb(){

console.log(this) ---->window

}

(2)、一个实例的this指向，指向是他的本身

1、function Aaa(){
        this.bbb=1111;
        console.log(this);
 }

Aaa.prototype.say=function(){
    console.log(this)
}
var bbb=new Aaa(); //this ---Aaa {bbb: 1111}
bbb.say();   //this ---Aaa {bbb: 1111}

new Aaa(); //this ---Aaa {bbb: 1111}

(2)引用类型  function的额外使用方法

var ccc=function(){};
ccc.aaa=function(){
    console.log(this)   //----->  function(){}
}
ccc.aaa();

典型案例：

    function Print(){
        var aaa=function(){
            return {
                Print:function(){
                    console.log(123)
                }
            }
        }
        aaa.Print=function(){
            console.log(321);
            console.log(this);  //----- fuction (){ return {....}}
            return this;
        }
        return aaa
    }


    Print()().Print()  //123
    Print().Print()()  //321

2、+new Date() == new Date().getTime();

3、Dom0级事件与Dom1级事件有什么区别；

1、事件的捕获到事件的冒泡；

事件是从事件捕获在到事件冒泡的一个过程；

html----body ----div ----body----html

（1）dom0级事件：

function bbb(){
    console.log('aaa');
}
document.getElementById('aaa').onclick=function ddd(){
    console.log('12333111');
}

</script>

执行结果： 12333111

dom1事件

document.getElementById('aaa').addEventListener('click',function(e){
    console.log(12333);
},false)
document.getElementById('aaa').addEventListener('click',function(){
    console.log(12333)
},false)
document.getElementById('aaa').addEventListener('click',function(){
    console.log(12333)
},false)

执行结果：

12333
12333
12333

区别：dom1事件进行addEventListener绑定的事件可以一一触发，dom级事件事件覆盖只剩一个；

addEventListener的第三个参数设置为true，则是捕获的过程，可以进行阻止事件的触发；例如

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="flexible.js"></script>
</head>
<body id="bbb">
<div id="aaa" onclick="bbb()">1221</div>
<script>
    function bbb(){
        console.log('aaa');
    }
    document.getElementById('aaa').onclick=function ddd(){
        console.log('12333111');
    }
    document.getElementById('bbb').addEventListener('click',function(e){
        e.stopPropagation();
        console.log('body');
    },true)
    document.getElementById('aaa').addEventListener('click',function(e){
        console.log(12333);
    },false)
    document.getElementById('aaa').addEventListener('click',function(){
        console.log(12333)
    },false)
    document.getElementById('aaa').addEventListener('click',function(){
        console.log(12333)
    },false)
</script>
</body>
</html>

执行结果：

body

(3)

bind(作用域，argument1，argument2)

eg：

   var aaa={
       bbb:function(aaa,ccc){
         return this.bbb+aaa+ccc;
       }
   }

   var ccc=aaa.bbb.bind({bbb:111},12，13);
   console.log(ccc());