1. 函數(shù)聲明和函數(shù)表達(dá)式的區(qū)別
- 函數(shù)聲明:不必放在調(diào)用的前面
//函數(shù)調(diào)用
sum();
//函數(shù)聲明
function sum(){
var a=1;
var b=1;
c=a+b;
return c;
}
- 函數(shù)表達(dá)式:必須放在調(diào)用的前面
var sum=function(){
var a=1;
var b=1;
c=a+b;
return c;
}
sum();
2. 變量的聲明前置和函數(shù)的聲明前置
- 變量的聲明前置:當(dāng)一個(gè)變量被定義時(shí),在代碼執(zhí)行前會(huì)先將變量進(jìn)行初始化再執(zhí)行語(yǔ)句蝴猪。
console.log(a); 聲明前置后 var a;
var a =1; console.log(a); // undefined
console.log(a); a =1 ;
console.log(a); // 1
- 函數(shù)的聲明前置:當(dāng)函數(shù)以函數(shù)聲明的方式聲明時(shí),代碼執(zhí)行前會(huì)首先生成該函數(shù)蚯撩,然后再執(zhí)行語(yǔ)句
sayHello(); 聲明前置后 function sayHello(){
function sayHello(){ console.log('hello');
console.log('hello'); }
} sayHello(); //'hello'
3. arguments
arguments是一個(gè)類(lèi)數(shù)組對(duì)象内狸,可以傳入function內(nèi)部所有的參數(shù)(本地變量)咆霜,但不是函數(shù)的屬性,只在函數(shù)內(nèi)部有效鼓寺,寫(xiě)法是arguments[i]依次對(duì)參數(shù)進(jìn)行訪問(wèn)和修改挑秉。
function printPersonInfo(name, age, sex){
console.log(name);
console.log(age);
console.log(sex);
console.log(arguments);
}
4. 實(shí)現(xiàn)函數(shù)的"重載"
在js中沒(méi)有函數(shù)的重載法梯,函數(shù)通過(guò)名字確定唯一性,參數(shù)不同也被認(rèn)為是相同的函數(shù)犀概,后出現(xiàn)的會(huì)覆蓋先出現(xiàn)的立哑,但可以在函數(shù)體針對(duì)不同的參數(shù)調(diào)用執(zhí)行相應(yīng)的邏輯,或通過(guò)arguments實(shí)現(xiàn)重載姻灶。
- 通過(guò)傳入?yún)?shù)實(shí)現(xiàn)重載
function userInfo(name,age,sex){
if(name){
console.log(name);
}
if(age){
console.log(age);
}
if(sex){
console.log(sex);
}
}
userInfo("andy",22); //參數(shù)依次傳遞值铛绰,缺少的參數(shù)返回的是
undefined userInfo("andrea",20,"female");
- 通過(guò)arguments來(lái)實(shí)現(xiàn)重載
function sum(){
var sum =0;
for (var i =0; i<arguments.length; i++){
sum += arguments[i];
}
return sum;
}
console.log(sum(1,2,3,4)); //輸出結(jié)果為10
5. 立即執(zhí)行函數(shù)表達(dá)式概念和作用
(function(){
var a = 1;
console.log(a); //1
})()
console.log(a); //報(bào)錯(cuò):Uncaught ReferenceError: a is not defined
其他寫(xiě)法
(function fn1() {
var a = 1;
console.log(a); //1
})();
console.log(a); //報(bào)錯(cuò):Uncaught ReferenceError: a is not defined
// 逗號(hào)也只能操作表達(dá)式
1, function fn3(){
var a = 1;
console.log(a); //1
}();
console.log(a); //報(bào)錯(cuò):Uncaught ReferenceError: a is not defined
!function(){
var a = 1;
console.log(a); //1
}();
console.log(a); //報(bào)錯(cuò):Uncaught ReferenceError: a is not defined
立即執(zhí)行函數(shù).jpg
作用:隔離作用域产喉,防止了變量的命名沖突至耻,形成獨(dú)立的空間若皱;可以讓函數(shù)在定義后直接調(diào)用镊叁,在固有的作用域內(nèi)使用尘颓,不會(huì)污染全局變量
6. 遞歸實(shí)現(xiàn)n!
function factor(n){
if(n===1||n===0){
return 1;
}
return n*factor(n-1);
}
7. 代碼練習(xí)
以上代碼輸出什么?
getInfo('饑人谷',2,'男')輸出結(jié)果:
name:饑人谷
age:2
sex:男
["饑人谷",2,"男"]
name valley
getInfo('小谷', 3)輸出結(jié)果:
name:小谷
age:3
sex:undefined
["小谷",3]
name valley
getInfo('男')輸出結(jié)果:
name:男
age:undefined
sex:undefined
["男"]
name valley
8. 寫(xiě)一個(gè)函數(shù)晦譬,返回參數(shù)的平方和
function sumOfSquares(){
var result=0;
for(var i=0; i<arguments.length; i++){
result+=arguments[i]*arguments[i];
}
return result;
}
var result = sumOfSquares(2,3,4)
var result2 = sumOfSquares(1,3)
console.log(result) //29
console.log(result2) //10
9. 代碼練習(xí)
以上代碼輸出什么疤苹?
變量聲明前置:
var a;
console.log(a); //underfined敛腌,變量聲明前置卧土,初始值undefined
a = 1;
console.log(b); //報(bào)錯(cuò):Uncaught ReferenceError:b is not defined,因?yàn)閎沒(méi)有聲明
10. 代碼練習(xí)
以上代碼輸出什么像樊?
sayName('world')輸出結(jié)果:
hello world
//函數(shù)聲明不必放在調(diào)用的前面
sayAge(10)輸出結(jié)果:
報(bào)錯(cuò):Uncaught TypeError: sayAge is not a function
//函數(shù)表達(dá)式必須放在調(diào)用的前面
11. 代碼練習(xí)
寫(xiě)出以下代碼的輸出結(jié)果和作用域鏈查找過(guò)程偽代碼
11.png
輸出結(jié)果:10
作用域鏈查找過(guò)程偽代碼:
1.globalContext={
AO:{
x:10
foo:function
bar:function
},
Scope:null
}
foo.[[scope]]=globalContext.AO
bar.[[scope]]=globalContext.AO
2.barContext={
AO:{
x:30
},
Scope:bar.[[scope]]
}
3.fooContext={
AO:{},
Scope:foo.[[scope]]
}
12. 代碼練習(xí)
寫(xiě)出以下代碼的輸出結(jié)果和作用域鏈查找過(guò)程偽代碼
12.png
輸出結(jié)果:30
作用域鏈查找過(guò)程偽代碼:
1. globalContext={
AO:{
x:10
bar:function
},
Scope:null
}
bar.[[scope]]=globalContext.AO
2. barContext={
AO:{
x:30
foo:function
},
Scope:bar.[[scope]]
}
foo.[[scope]]=barContext.AO
3. fooContext={
AO:{},
Scope:foo.[[scope]]
}
13. 代碼練習(xí)
寫(xiě)出以下代碼的輸出結(jié)果和作用域鏈查找過(guò)程偽代碼
13.png
輸出結(jié)果:30
作用域鏈查找過(guò)程偽代碼:
1. globalContext={
AO:{
x:10
bar:function
},
Scope:null
}
bar.[[scope]]=globalContext.OA
2. barContext={
AO:{
x:30
function:function
},
Scope:bar.[[scope]]
}
function.[[scope]]=barContext.OA
3. functionContext={
AO:{},
Scope:function.[[scope]]
}
14. 代碼練習(xí)
寫(xiě)出以下代碼的輸出結(jié)果和作用域鏈查找過(guò)程偽代碼
14.png
輸出結(jié)果:undefined 5 1 6 20 200
作用域鏈查找過(guò)程偽代碼:
1. globalContext = {
AO:{
a:1 //200
fn:function
fn3:function
},
Scope:null
}
fn.[[scope]] = globalContext.AO
fn3.[[scope]] = globalContext.AO
2.調(diào)用fn()
fnContext = {
AO:{
a:undefined //5,6,20
fn2:function
},
Scope:fn.[[scope]] //globalContext.AO
}
fn2.[[scope]] = fnContext.AO
3. fn3Context = {
AO:{
a:200
},
Scope:fn3Context.[[scope]] //globalContext.AO
}
4. fn2ConText = {
AO:{
a:20
},
Scope:fn2ConText.[[scope]] //fnContext.AO
}
注釋