一、this的指向問題:html
(1) 定義的function中的this指向的是windowdom
如:函數
function aaa(){flex
console.log(this) ----->windowui
}this
或者是內嵌的函數:spa
var aaa={prototype
vvv:function(){scala
function bbb(){code
console.log(this) ---->window
}
}
}
(2)、一個實例的this指向,指向是他的自己
一、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
二、+new Date() == new Date().getTime();
三、Dom0級事件與Dom1級事件有什麼區別;
一、事件的捕獲到事件的冒泡;
事件是從事件捕獲在到事件冒泡的一個過程;
html----body ----div ----body----html
(1)dom0級事件:
<div id="aaa" onclick="bbb()">222</div>
<script>
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());