- this我們一定不陌生但是它有四個(gè)指向你造嗎
- 1.方法調(diào)用 指向方法
var age = 38;
var obj = {
age: 18,
getAge: function() {
console.log(this.age);
}
};
obj.getAge(); // 18
var fn = obj.getAge;
fn(); // 38
- 2.函數(shù)調(diào)用,里面的this指向的是window
var age = 38;
var obj = {
age: 18,
getAge: function() {
var fn = function() {
console.log(this.age);
};
fn(); // window 38
}
};
obj.getAge(); // 18
- 3.構(gòu)造函數(shù)調(diào)用:this指向調(diào)用它的對(duì)象
var age = 38;
var obj = {
age: 18
};
var getAge = function() {
console.log(this.age);
};
obj.get = getAge;
obj.get(); // 18
- 4.上下文調(diào)用模式巢音,this指向誰?指向的是傳入的對(duì)象
call,apply :上下文調(diào)用模式
var arr = [1,3,4,6,7,555,333,13]
var max = arr[0]
for(let i=0;i<arr.length;i++){
if(max < arr[i]){
max = arr[i]
}
}
console.log(max)
console.log(Math.max(1,2,3,4,5))
console.log(Math.max.apply(arr,arr)) //=== Math.max(1,3,4,6,7,555,333,13)
console.log(Math.max.call(arr,1,3,4,6,7,555,333,13))
這里this是在clla取具、apply方法內(nèi)部的,指向傳入的對(duì)象arr
-5. 除了我們常見的數(shù)組arr之外還有一個(gè)偽數(shù)組你造嗎
- 偽數(shù)組arguments,是一個(gè)對(duì)象: 訪問方式:和數(shù)組一樣,但不能使用數(shù)組的方法
var a = {
0: 'a',
1:'b',
2:'c',
length:3
}
function aa(){
console.log(arguments)
// 調(diào)出偽數(shù)組arguments
}
var ps = "name"
aa(ps)
function sum(){
console.log(arguments[2]);
// [].join()
console.log(Array.prototype.join.call(arguments,"-"))
// 給偽數(shù)組添加-
arguments.join("-")
}
sum("aa","bb","cc")
- 6.作用域和預(yù)處理
在運(yùn)行前進(jìn)行預(yù)處理,把var定義的變量,以及函數(shù)捞烟,都會(huì)先進(jìn)行聲明
es5以函數(shù)區(qū)分作用域
let const es6定義變量和常量,以{}區(qū)分作用域,嚴(yán)格區(qū)分寫法账锹、作用域 - DOM事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>DOM事件</title>
<style>
li{
border: 1px solid red;
}
</style>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
<script>
// ()() 還有個(gè)用途就是生成一個(gè) 命名空間, 可以 類似于自調(diào)用,前面的括號(hào)放我們的閉包函數(shù)
// 后面的括號(hào)相當(dāng)于調(diào)用這個(gè)閉包函數(shù)里面也可以傳參數(shù)
// 事件隊(duì)列:在大量事件待執(zhí)行的時(shí)候會(huì)把事件列一個(gè)隊(duì)列等待調(diào)用
var dom = document.querySelectorAll('li');
for(let j=0;j<dom.length;j++){
dom[j].onclick=function(){
console.log(j+1)
}
}
// 添加事件的擴(kuò)展
// DOM 事件 最常用的
var lis = document.querySelectorAll('li')
for(let i=0;i<lis.length;i++){
// 參數(shù);事件類型 事件處理函數(shù)(回調(diào)) 監(jiān)聽器 冒泡或者捕獲(布爾值)
lis[i].addEventListener('click',function(){
console.log(i);
},false)
}
// 和onclick的區(qū)別,onclick會(huì)覆蓋坷襟,也就是說只能同一個(gè)節(jié)點(diǎn)有一個(gè)
// 而addEventListener不會(huì)覆蓋
// 事件三要素:事件源 事件類型 (事件處理函數(shù))執(zhí)行函數(shù)
// 事件流程:冒泡(從內(nèi)往外) 捕獲(從外往內(nèi))
</script>
</body>
</html>