JavaScript程序設(shè)計(jì)20211課程導(dǎo)入2任務(wù)導(dǎo)入3知識(shí)講解4任務(wù)實(shí)施項(xiàng)目3-1函數(shù)的設(shè)置與調(diào)用5任務(wù)總結(jié)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)創(chuàng)建數(shù)組的兩種方法？如何訪問數(shù)組？實(shí)現(xiàn)數(shù)組遍歷的方法？如何創(chuàng)建二維數(shù)組？二維數(shù)組遍歷的方法？提問知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)任務(wù)重難點(diǎn)利用函數(shù)完成獲取指定年份的2月份的天數(shù)重點(diǎn)：初識(shí)函數(shù)（函數(shù)的定義、函數(shù)的使用、函數(shù)的參數(shù)、函數(shù)的返回值）通過函數(shù)案例進(jìn)一步理解函數(shù)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)初識(shí)函數(shù)

1.1函數(shù)的使用1.初識(shí)函數(shù)函數(shù)在使用時(shí)分為兩步，聲明函數(shù)和調(diào)用函數(shù)functionsayHello

(){//函數(shù)體代碼}sayHello()//調(diào)用函數(shù)語(yǔ)法結(jié)構(gòu)function是聲明函數(shù)的關(guān)鍵字（全部小寫）函數(shù)名知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)初識(shí)函數(shù)

1.2函數(shù)的定義在編寫代碼時(shí)，可能會(huì)出現(xiàn)非常多的相同代碼，或者功能類似的代碼，這些代碼可能需要大量重復(fù)使用，此時(shí)就可以使用JavaScript中的函數(shù)。functiongetSum(num1,num2){varsum=0;for(vari=num1;i<=num2;i++){sum+=i;}console.log(sum);//函數(shù)執(zhí)行結(jié)束后，將結(jié)果輸出}getSum(1,100); //輸出結(jié)果：5050getSum(10,50); //輸出結(jié)果：1230函數(shù)：求n~m的累加和調(diào)用getSum()定義getSum()知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)初識(shí)函數(shù)

1.3函數(shù)的參數(shù)函數(shù)的參數(shù)分為形參和實(shí)參：形參：在聲明函數(shù)時(shí)，在函數(shù)名稱后面的小括號(hào)中添加的一些參數(shù)實(shí)參：當(dāng)函數(shù)調(diào)用的時(shí)候，需要傳遞相應(yīng)的參數(shù)，這些參數(shù)稱為實(shí)參function函數(shù)名(形參1,形參2,…){//函數(shù)聲明的小括號(hào)中的是形參//函數(shù)體代碼}函數(shù)名(實(shí)參1,實(shí)參2,…)//函數(shù)調(diào)用的小括號(hào)中的是實(shí)參語(yǔ)法結(jié)構(gòu)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)初識(shí)函數(shù)注意：函數(shù)的參數(shù)允許形參和實(shí)參的個(gè)數(shù)不同：當(dāng)實(shí)參數(shù)量多于形參數(shù)量時(shí)，函數(shù)正常執(zhí)行，多余的實(shí)參會(huì)被忽略當(dāng)實(shí)參數(shù)量小于形參數(shù)量時(shí)，多出來(lái)的形參類似于一個(gè)已聲明未賦值的變量，其值為undefinedfunctiongetSum(num1,num2){console.log(num1,num2);}getSum(1,2,3); //實(shí)參數(shù)量大于形參數(shù)量，輸出結(jié)果：12getSum(1);//實(shí)參數(shù)量小于形參數(shù)量，輸出結(jié)果：1undefined示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)初識(shí)函數(shù)

1.4函數(shù)的返回值函數(shù)的返回值可以將函數(shù)的處理結(jié)果返回，用于根據(jù)函數(shù)的執(zhí)行結(jié)果來(lái)決定下一步要做的事情，函數(shù)的返回值通過return語(yǔ)句實(shí)現(xiàn)。function函數(shù)名(){return要返回的值;//利用return返回一個(gè)值給調(diào)用者}語(yǔ)法結(jié)構(gòu)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)初識(shí)函數(shù)

1.5arguments的使用當(dāng)不確定函數(shù)中接收到了多少個(gè)實(shí)參的時(shí)候，可以用arguments來(lái)獲取實(shí)參。這是因?yàn)閍rguments是當(dāng)前函數(shù)的一個(gè)內(nèi)置對(duì)象，所有函數(shù)都內(nèi)置了一個(gè)arguments對(duì)象，該對(duì)象保存了函數(shù)調(diào)用時(shí)傳遞的所有的實(shí)參。functionfn(){console.log(arguments); //輸出結(jié)果：Arguments(3)

[1,2,3,…]console.log(arguments.length);//輸出結(jié)果：3console.log(arguments[1]);//輸出結(jié)果：2}fn(1,2,3);示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.1利用函數(shù)求任意兩個(gè)數(shù)的最大值案例要求：編寫一個(gè)getMax()函數(shù)，該函數(shù)接收兩個(gè)參數(shù)，分別是num1和num2，表示兩個(gè)數(shù)字。收到參數(shù)后，比較兩個(gè)數(shù)的大小，返回較大的值。functiongetMax(num1,num2){returnnum1>num2?num1:num2;}console.log(getMax(1,3)); //輸出結(jié)果：3示例代碼2.函數(shù)案例知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.2利用函數(shù)求任意一個(gè)數(shù)組中的最大值案例要求：利用函數(shù)求數(shù)組[5,2,99,101,67,77]中的最大數(shù)值。functiongetArrMax(arr){varmax=arr[0];for(vari=1;i<=arr.length;i++){if(arr[i]>max){max=arr[i];}}returnmax;}vararr=getArrMax([5,2,99,101,67,77]);console.log(arr); //輸出結(jié)果：101示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.3利用return提前終止函數(shù)案例要求：在getMax()函數(shù)中判斷兩個(gè)參數(shù)是否都是數(shù)字型，只要其中一個(gè)不是數(shù)字型，則提前返回NaN。functiongetMax(num1,num2){if(typeofnum1!='number'||typeofnum2!='number'){returnNaN;}returnnum1>num2?num1:num2;}console.log(getMax(1,'3'));//輸出結(jié)果：NaN示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.4利用return返回?cái)?shù)組案例要求：在開發(fā)中，當(dāng)需要返回多個(gè)值的時(shí)候，可以用數(shù)組來(lái)實(shí)現(xiàn)，也就是將要返回的多個(gè)值寫在數(shù)組中，作為一個(gè)整體來(lái)返回。functiongetResult(num1,num2){return[num1+num2,num1-num2,num1*num2,num1/num2];}console.log(getResult(1,2));//輸出結(jié)果：(4)

[3,-1,2,0.5]示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.5

利用函數(shù)求所有參數(shù)中的最大值案例要求：編寫一個(gè)getMax()函數(shù)，該函數(shù)可以傳任意數(shù)量的參數(shù)，在函數(shù)中會(huì)找出所有參數(shù)中最大的一個(gè)值，將該值返回。functiongetMax(){varmax=arguments[0];for(vari=1;i<arguments.length;i++){if(arguments[i]>max){max=arguments[i];}}returnmax;}console.log(getMax(11,2,34,666,5,100)); //輸出結(jié)果：666示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.6

利用函數(shù)反轉(zhuǎn)數(shù)組元素順序案例要求：編寫一個(gè)reverse()函數(shù)，該函數(shù)的參數(shù)是一個(gè)數(shù)組，在函數(shù)中會(huì)對(duì)數(shù)組中的元素順序進(jìn)行反轉(zhuǎn)，返回反轉(zhuǎn)后的數(shù)組。functionreverse(arr){varnewArr=[];for(vari=arr.length-1;i>=0;i--){newArr[newArr.length]=arr[i];}returnnewArr;}vararr1=reverse([1,3,4,6,9]);console.log(arr1); //輸出結(jié)果：(5)

[9,6,4,3,1]示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)案例

2.7利用函數(shù)判斷閏年案例要求：編寫一個(gè)isLeapYear()函數(shù)，該函數(shù)的參數(shù)是一個(gè)年份數(shù)字，在函數(shù)中會(huì)判斷該年份是否為閏年，返回布爾值的結(jié)果。functionisLeapYear(year){varflag=false;if(year%4==0&&year%100!=0||year%400==0){flag=true;}returnflag;}console.log(isLeapYear(2020)?'2020是閏年':'2020不是閏年');console.log(isLeapYear(2021)?'2021是閏年':'2021不是閏年');示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)【案例】獲取指定年份的2月份的天數(shù)案例要求：編寫一個(gè)fn()函數(shù)，該函數(shù)調(diào)用后會(huì)彈出一個(gè)輸入框，要求用戶輸入一個(gè)年份，輸入以后，程序會(huì)提示該年份的2月份有多少天。functionfn(){varyear=prompt('請(qǐng)輸入年份：');if(isLeapYear(year)){alert(‘當(dāng)前年份是閏年，2月份有29天’);}else{alert('當(dāng)前年份是平年，2月份有28天');}}functionisLeapYear(year){//將上一個(gè)案例中的isLeapYear()函數(shù)中的代碼復(fù)制到此處}fn();示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)總結(jié)：本章主要介紹了什么是函數(shù)、函數(shù)的使用、參數(shù)和返回值的設(shè)置，然后講解了使用arguments來(lái)獲取未知的實(shí)參個(gè)數(shù)及函數(shù)表達(dá)式。

作業(yè)：完成獲取指定年份的2月份的天數(shù)函數(shù)。1課程導(dǎo)入2任務(wù)導(dǎo)入3知識(shí)講解4任務(wù)實(shí)施項(xiàng)目3-2函數(shù)進(jìn)階5任務(wù)總結(jié)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)的使用步驟？函數(shù)的形參和實(shí)參數(shù)量不一致怎么辦？函數(shù)沒有返回值可以嗎？如何查詢實(shí)參的個(gè)數(shù)？提問知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)任務(wù)重難點(diǎn)練習(xí)回調(diào)函數(shù)、遞歸函數(shù)對(duì)比變量的作用域重點(diǎn)：函數(shù)表達(dá)式回調(diào)函數(shù)遞歸函數(shù)作用域與作用域鏈知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階1.函數(shù)進(jìn)階

1.1

函數(shù)表達(dá)式函數(shù)表達(dá)式：是將聲明的函數(shù)賦值給一個(gè)變量，通過變量完成函數(shù)的調(diào)用和參數(shù)的傳遞，函數(shù)表達(dá)式的定義必須在調(diào)用前。varsum=function(num1,num2){ //函數(shù)表達(dá)式returnnum1+num2;};console.log(sum(1,2)); //調(diào)用函數(shù)，輸出結(jié)果：3語(yǔ)法結(jié)構(gòu)匿名函數(shù)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階var

fn=functionsum(num1,num2){returnnum1+num2;};fn(); sum();functionsum(num1,num2){returnnum1+num2;}; 函數(shù)表達(dá)式函數(shù)聲明方式①函數(shù)的定義方式不同②函數(shù)的調(diào)用方式不同③函數(shù)定義與調(diào)用順序不同知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階匿名函數(shù)概念：匿名函數(shù)指的是沒有函數(shù)名稱的函數(shù)。作用：可以有效的避免全局變量的污染以及函數(shù)名的沖突問題。說明：既是函數(shù)表達(dá)式的另一種表示形式，又可通過函數(shù)聲明的方式實(shí)現(xiàn)調(diào)用。varfn=function(num1,num2){returnnum1+num2;};fn(1,2);①函數(shù)表達(dá)式中省略函數(shù)名(function(num1,num2){returnnum1+num2;})(2,3);②自調(diào)用方式document.body.onclick=function(){alert('Hi,everybody!');};③處理事件知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階多學(xué)一招箭頭函數(shù)概念：ES6中引入了一種新的語(yǔ)法編寫匿名函數(shù)，我們稱之為箭頭函數(shù)。特點(diǎn)：一個(gè)箭頭函數(shù)表達(dá)式的語(yǔ)法比一個(gè)函數(shù)表達(dá)式更短。(p1,p2,…,pN)=>{statements}參數(shù)函數(shù)體多個(gè)參數(shù)：(p1,p2,…,pN)一個(gè)參數(shù)：(p1)或p1沒有參數(shù)：()或_函數(shù)體：{statements}返回值：{returnexpression;}函數(shù)體只有一條語(yǔ)句：expression知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階多學(xué)一招箭頭函數(shù)//設(shè)置1個(gè)參數(shù)varfn1=x=>x+2;console.log(fn1(4));//輸出結(jié)果：6//設(shè)置2個(gè)參數(shù)varfn2=(x,y)=>x+y;console.log(fn2(1,2));//輸出結(jié)果：3示例知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階多學(xué)一招箭頭函數(shù)值得一提箭頭函數(shù)中箭頭“=>”不是操作符或者運(yùn)算符，但是箭頭函數(shù)相比普通的函數(shù)受操作符的優(yōu)先級(jí)影響。知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階

1.2

回調(diào)函數(shù)回調(diào)函數(shù)：指的就是一個(gè)函數(shù)A作為參數(shù)傳遞給一個(gè)函數(shù)B，然后在B的函數(shù)體內(nèi)調(diào)用函數(shù)A。此時(shí)，稱函數(shù)A為回調(diào)函數(shù)。以算術(shù)運(yùn)算為例進(jìn)行講解：functioncal(num1,num2,fn){returnfn(num1,num2);}console.log(cal(45,55,function(a,b){returna+b;}));console.log(cal(10,20,function(a,b){returna*b;}));2示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階

1.3

遞歸調(diào)用遞歸調(diào)用：指的是一個(gè)函數(shù)在其函數(shù)體內(nèi)調(diào)用自身的過程，這種函數(shù)稱為遞歸函數(shù)。下面以根據(jù)用戶的輸入計(jì)算指定數(shù)據(jù)的階乘為例進(jìn)行演示。知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)進(jìn)階functionfactorial(n){ //定義回調(diào)函數(shù)if(n==1){return1;//遞歸出}returnn*factorial(n-1);}varn=prompt('求n的階乘\nn是大于等于1的正整數(shù)，如2表示求2!。');n=parseInt(n);if(isNaN(n)){console.log('輸入的n值不合法')}else{console.log(n+'的階乘為：'+factorial(n));}示例代碼知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)練習(xí)回調(diào)函數(shù)的使用練習(xí)遞歸調(diào)用函數(shù)對(duì)比變量的作用域知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)總結(jié)：本章主要講解了函數(shù)表達(dá)式，接著針對(duì)函數(shù)的全局變量和局部變量的作用域進(jìn)行了講解。

作業(yè)：練習(xí)課上講解的函數(shù)。1課程導(dǎo)入2任務(wù)導(dǎo)入3知識(shí)講解4任務(wù)實(shí)施項(xiàng)目3-3作用域和閉包函數(shù)5任務(wù)總結(jié)知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)函數(shù)表達(dá)式的定義有位置要求嗎？箭頭函數(shù)怎么表示？回調(diào)函數(shù)的功能是什么？提問知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)任務(wù)重難點(diǎn)對(duì)比變量作用域練習(xí)閉包函數(shù)重點(diǎn)：變量的作用域作用域鏈閉包函數(shù)預(yù)解析知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)作用域

1.1

作用域的分類變量需要在它的作用范圍內(nèi)才可以被使用，這個(gè)作用范圍稱為變量的作用域，JavaScript根據(jù)作用域使用范圍的不同，劃分如下：全局變量：不在任何函數(shù)內(nèi)聲明的變量（顯式定義）或在函數(shù)內(nèi)省略var聲明的變量（隱式定義）都稱為全局變量局部變量：在函數(shù)體內(nèi)利用var關(guān)鍵字定義的變量稱為局部變量塊級(jí)變量：ES6提供的let關(guān)鍵字聲明的變量稱為塊級(jí)變量1.作用域demo.js文件函數(shù)含有{}，如for函數(shù)作用域全局作用域塊級(jí)作用域知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)作用域

1.2

全局變量和局部變量?jī)烧叩膮^(qū)別：

在全局作用域下，添加或省略var關(guān)鍵字都可以聲明全局變量，全局變量在瀏覽器關(guān)閉頁(yè)面的時(shí)候才會(huì)銷毀，比較占用內(nèi)存資源在函數(shù)中，添加var關(guān)鍵字聲明的變量是局部變量，省略var關(guān)鍵字時(shí)，如果變量在當(dāng)前作用域下不存在，會(huì)自動(dòng)向上級(jí)作用域查找變量。局部變量在函數(shù)執(zhí)行完成后就會(huì)銷毀，比較節(jié)約內(nèi)存資源知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)作用域在開發(fā)中若要保留局部變量的值，可以通過以下兩種方式實(shí)現(xiàn)：//第1種方式：利用return返回functiontest(num){

num=num+1;returnnum;}var

num=test(24);console.log(num);//輸出結(jié)果：25//第2種方式：利用全局變量保存varmemory;functiontest(num){memory=num+1;}test(24);console.log(memory);//輸出結(jié)果：25知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)作用域

1.3

作用域鏈作用域鏈：當(dāng)在一個(gè)函數(shù)內(nèi)部聲明另一個(gè)函數(shù)時(shí)，內(nèi)層函數(shù)只能在外層函數(shù)作用域內(nèi)執(zhí)行，在內(nèi)層函數(shù)執(zhí)行的過程中，若需要引入某個(gè)變量，首先會(huì)在當(dāng)前作用域中尋找，若未找到，則繼續(xù)向上一層級(jí)的作用域中尋找，直到全局作用域，稱這種鏈?zhǔn)降牟樵冴P(guān)系為作用域鏈。知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)作用域全局作用域vari=10;fn1函數(shù)fn2函數(shù)alert(i);作用域鏈符號(hào)含義參考F：表示向上查找N：沒有找到Y(jié)：找到NFNFY知識(shí)回顧任務(wù)導(dǎo)入知識(shí)講解任務(wù)實(shí)施任務(wù)總結(jié)閉包函數(shù)2.閉包函數(shù)

2.1

什么是閉包