JavaScript是一種能讓你的網(wǎng)頁(yè)更加生動(dòng)活潑的語(yǔ)言，你可以利用JavaScript輕易的做出親切的歡迎訊息、漂亮的數(shù)字鐘、有廣告效果的跑馬燈及簡(jiǎn)易的選舉，還可以顯示瀏覽器停留的時(shí)間。讓這些特殊效果提高網(wǎng)頁(yè)的可觀性，和用戶更好的交互。是web2.0時(shí)代不可或缺的客戶端語(yǔ)言。

JavaScript能用來(lái)干什么？

1.數(shù)據(jù)的驗(yàn)證。

2.將動(dòng)態(tài)的內(nèi)容寫(xiě)入到網(wǎng)頁(yè)當(dāng)中。

3.可以對(duì)事件做出響應(yīng)。

4.可以讀寫(xiě)html中的內(nèi)容。

5.可以檢測(cè)瀏覽器

6.可以創(chuàng)建cookies

7.模擬動(dòng)畫(huà)…

JavaScript語(yǔ)法特點(diǎn)

基于對(duì)象 和 事件驅(qū)動(dòng) 的 松散型的 解釋性 語(yǔ)言

1、javascript面向?qū)ο箝_(kāi)發(fā)的

2. 事件驅(qū)動(dòng)

3.松散型 弱類型

var a="asc";var a=123;

4.解釋型語(yǔ)言。

由宿主環(huán)境(瀏覽器)解釋執(zhí)行

JavaScript的組成部分

JavaScript基礎(chǔ)語(yǔ)法

JavaScaript輸出工具輸出工具

A. alert(); 彈窗 會(huì)以文本的原格式輸出

B. document.write() 輸出到頁(yè)面，會(huì)以html的語(yǔ)法解析里面的內(nèi)容

C. prompt(“”,“”) 輸入框JavaScaript放置引用A.B.可以在超鏈接或是重定向的位置調(diào)用javascript代碼格式："javascript:alert('我是超鏈接')"重定向格式：action="javascript:alert('我是表單')"C.在事件后面進(jìn)行調(diào)用格式：onclick="alert('我是事件')"

D.調(diào)用外部JavaScript文件格式：放置的時(shí)候注意事項(xiàng)

1.JavaScript可以在html頁(yè)面當(dāng)中的任何位置來(lái)進(jìn)行調(diào)用， 但是他們還是一個(gè)整體，是相互聯(lián)系，相互影響。

2.在調(diào)用頁(yè)面標(biāo)簽對(duì)當(dāng)中不能有任何代碼在js腳本中不能出現(xiàn)

標(biāo)簽對(duì)。JavaScript注釋

行內(nèi)注釋: // 注釋內(nèi)容

塊注釋:/* 注釋內(nèi)容*/

對(duì)付舊的瀏覽器JavaScript變量變量：可以存儲(chǔ)數(shù)據(jù)的一個(gè)容器?？梢源鎯?chǔ)和引用任何的數(shù)據(jù)。變量的創(chuàng)建：一般來(lái) 說(shuō)要以“var”關(guān)鍵來(lái)修飾。A.先聲明，后賦值var b;b="www.baidu.com";B.聲明和賦值同時(shí)進(jìn)行var url="www.sxuek.com";

C.一次聲明多個(gè)變量，然后再賦值var name, age ,sex;name="lisi";age=14;sex="boy";

D.一次聲明多個(gè)變量同時(shí)進(jìn)行賦值。var name="wangwu",age=17,sex="girl";

JavaScript命名規(guī)范

1. 嚴(yán)格區(qū)分大小寫(xiě)

2. 變量的命名必須以字母或 _或 $開(kāi)頭，余下的部分可以是任意的字母，數(shù)字，或者是 _或者是$

3.不能用關(guān)鍵字或者是保留字命名。

4.javascript自己的命名習(xí)慣駝峰命名法：getElementById首字母大寫(xiě)：Object

5.命名一定要有意義。

6. ;的用法

聲明變量注意的問(wèn)題

1.覆蓋已有變量

A.如何重新聲明該變量，而沒(méi)有賦值，該變量的值不會(huì)改變

B.如果重新聲明該變量并且重新賦值，那么舊的變量值會(huì)刪除，改為新的變量值。

2.不用var 關(guān)鍵字來(lái)修飾變量aa="我是沒(méi)有聲明的“alert(aa);

A.如果不用var關(guān)鍵來(lái)修飾的變量，并且這個(gè)所謂的變量也沒(méi)有賦值，那么javascript會(huì) 報(bào)錯(cuò)。

B.如果不用var關(guān)鍵來(lái)修飾的變量，但是變量賦值了，那么javascript會(huì)把他當(dāng)作一個(gè)全 局變量來(lái)處理，不會(huì)報(bào)錯(cuò)。但是我們不推薦使用。

JavaScript中的數(shù)據(jù)類型

1.初始類型(基本類型)

– Undefined– Null– Number– String– Boolean

2.引用類型– object (class)JavaScript中的數(shù)據(jù)類型

typeof 操作符– 他是用來(lái)檢測(cè)數(shù)據(jù)類型的一元運(yùn)算符，并且返回的結(jié)果始終是一個(gè)字符串。初始類型-String類型

用單雙引號(hào)來(lái)說(shuō)明，他所包圍的值都可以是字符串。

單雙引號(hào)的用法：

– 效率是一樣的

– 只能成對(duì)出現(xiàn)，不能相互交叉使用

– 可以相互嵌套。

– 還包括一些特殊的字符:

– \n 換行

– \t 制表符

– \b 空格

– \r 回車(chē)

– \' ‘

– \" “

– \\ \

初始類型-Number類型

Number數(shù)值類型

包括整型和浮點(diǎn)型。支持二進(jìn)制、八進(jìn)制、十進(jìn)制、十六進(jìn)制。用科學(xué)計(jì)數(shù)法來(lái)表示，還包括一些特殊的值：

Number.MAX_VALUE 最大值

Number.MIN_VALUE 最小值

初始類型- Undefined

Undefined指的就是變量創(chuàng)建后但是沒(méi)有賦值，而變量的默認(rèn)值就是undefined.

初始類型- null

Null

指的是什么都沒(méi)有，是一個(gè)空對(duì)象。相當(dāng)于一個(gè)占位符。

引用類型

object (class)

包含相關(guān)屬性和方法的一個(gè)集合。

new 關(guān)鍵字。

var obj=new Object()

var obj={};

JavaScaript運(yùn)算符

運(yùn)算符和操作數(shù)的組合就稱為表達(dá)式。

?算術(shù)運(yùn)算符

關(guān)系運(yùn)算符(比較運(yùn)算符)

賦值運(yùn)算符

邏輯運(yùn)算符

一元運(yùn)算符

三元運(yùn)算符

特殊運(yùn)算符

算數(shù)運(yùn)算符

+? -? * ? %? var++ ? ++var? var-- ? --var

– “+” 加號(hào)(字符串連接號(hào))

? 用于數(shù)值的運(yùn)算

? 用于字符串的連接

– 任何的數(shù)據(jù)類型和字符串相加都是等于相加以后的字符串

– “%”(取余)

(1)用來(lái)取某個(gè)數(shù)的余數(shù)

(2)用于取一段范圍的值

(3) 一般不用于小數(shù)，因?yàn)榻Y(jié)果不確定。

– var++

? 先運(yùn)行，再自增，比較無(wú)私，先人后己

– ++val? 先自增，再運(yùn)行，比較自私，先己后人

關(guān)系運(yùn)算符(比較運(yùn)算符)

<?? > ? <=?? >=?? ==??? ===??? !=?? !==

– 他們運(yùn)算的結(jié)果都是布爾值。

– == 比較兩個(gè)數(shù)的值是否相等

– === 不但比較值是否相等，還比較類型是否相等。

關(guān)系運(yùn)算符(比較運(yùn)算符)注意

? 都是數(shù)值的時(shí)候，他會(huì)正常比較

? 如果兩個(gè)都是字符串進(jìn)行比較,從他們的第一個(gè)開(kāi)始先轉(zhuǎn)換為ASCII碼值開(kāi)始依次比較，直到比較出大小。

? 當(dāng)一個(gè)字符串，另一個(gè)是數(shù)值的時(shí)候，把字符串嘗試轉(zhuǎn)換成數(shù)值類型，然后進(jìn)行比較，如果不能轉(zhuǎn)換成數(shù)值類型 ，返回假

?如果兩個(gè)數(shù)值都為字符串 則把第一個(gè)值進(jìn)行轉(zhuǎn)換ASCII碼后比較大小;

? undefined== null為真

? 如果一個(gè)數(shù)值和布爾值進(jìn)行比較，會(huì)把布爾值轉(zhuǎn)換為數(shù)值再進(jìn)行比較，true為1，false為 0

賦值運(yùn)算符

=?? += ? -=?? *= ? /=?? %=

– +=

?var num=1 ;

num+=3;

num=num+3

邏輯運(yùn)算符

與 and &&? 或 or || 非not !

– &&

? 運(yùn)算符兩邊只要有一個(gè)是假，那么他的運(yùn)算結(jié)果就是假，只有兩個(gè)都為真的時(shí)候，運(yùn)算結(jié)果才是真的。

– ||

? 算符兩邊只要有一個(gè)是真的那么他就是真的，只有當(dāng)兩個(gè)都是假的時(shí)候，他才是假的。

– !

? 取反，假的變成真的，真的變成假的。邏輯運(yùn)算符注意

? 邏輯運(yùn)算符可以對(duì)任何類型的數(shù)據(jù)進(jìn)行運(yùn)算但是在運(yùn)算的時(shí)候，可以轉(zhuǎn)換為對(duì)應(yīng)的布爾值 Boolean? Undefine false

? Null false

? Boolean 就是本身的值

? Number 除了0以外都是真的

? String 除了空字符串以外都是真的

? 對(duì)象 真的一元運(yùn)算符

typeof + - delete new ++ --

– +

? 正號(hào)、正數(shù)

– delete

? 刪除對(duì)象的方法或是屬性

– new

? 用來(lái)創(chuàng)建一個(gè)對(duì)象

三元運(yùn)算符

根據(jù)表達(dá)式的計(jì)算結(jié)果有條件的為變量賦值

格式:

var 變量= Boolean expression?條件為真的值:條件為假的值

特殊運(yùn)算符

“，” ? ? “()”

– “，”

? 用來(lái)一次聲明多個(gè)變量– “()”

? 在運(yùn)算的時(shí)候有優(yōu)先級(jí)的作用

? 可以讓函數(shù)運(yùn)行

JavaScript流程控制

流程:就是程序代碼的執(zhí)行順序。

流程控制:通過(guò)規(guī)定的語(yǔ)句讓程序代碼有條件的按照一定的方式執(zhí)行

順序結(jié)構(gòu)

–按照書(shū)寫(xiě)順序來(lái)執(zhí)行，是程序中最基本的流程結(jié)構(gòu)。

選擇結(jié)構(gòu)(分支結(jié)構(gòu)、條件結(jié)構(gòu))

–根據(jù)給定的條件有選擇的執(zhí)行相應(yīng)的語(yǔ)句

循環(huán)結(jié)構(gòu)

–在給定的條件滿足的情況下，反復(fù)的執(zhí)行同一段代碼。

選擇結(jié)構(gòu)(分支結(jié)構(gòu)、條件結(jié)構(gòu))

1.單路分支

//條件可以是表達(dá)式也可以是任何的數(shù)據(jù)類型

//大括號(hào)會(huì)把他里面的代碼當(dāng)作一個(gè)整體來(lái)運(yùn)行，如果只有一條語(yǔ)句，可以省略大括號(hào)

if(條件){

條件成立執(zhí)行的語(yǔ)句

}

2.雙路分支

if(條件){

條件成立的時(shí)候執(zhí)行的代碼

}else{

條件不成立的時(shí)候執(zhí)行的代碼

}

選擇結(jié)構(gòu)(分支結(jié)構(gòu)、條件結(jié)構(gòu))

3.多路分支

if(條件1){

條件1成立執(zhí)行的代碼

}else if(條件2){

條件2成立執(zhí)行的代碼

}else if(條件3){

條件3成立執(zhí)行的代碼

}.....

.else{

如果上述條件都不成立執(zhí)行的代碼

}

選擇結(jié)構(gòu)(分支結(jié)構(gòu)、條件結(jié)構(gòu))

4.嵌套分支

if(條件1){

if(){

}else if(){

}....

}else if(條件2){

條件2成立執(zhí)行的代碼

}else if(條件3){

條件3成立執(zhí)行的代碼

}......

else{

如果上述條件都不成立執(zhí)行的代碼

}

選擇結(jié)構(gòu)(分支結(jié)構(gòu)、條件結(jié)構(gòu))

switch語(yǔ)句

switch(變量任何的數(shù)據(jù)類型){

case 值1:

表達(dá)式1；

break;

case 值2:

表達(dá)式3；

break;

.........default:

表達(dá)式；

}

分支結(jié)構(gòu)注意事項(xiàng)

1.當(dāng)判斷某種范圍的時(shí)候最好用if語(yǔ)句，當(dāng)判斷單個(gè)值時(shí)候用switch

2.條件滿足的情況不可以重復(fù)，會(huì)發(fā)生不可預(yù)期的錯(cuò)誤。

循環(huán)結(jié)構(gòu)

循環(huán)：在給定的條件滿足的情況下，重復(fù)的執(zhí)行同一段代碼。

1.for循環(huán)

for(變量=初始值;變量<=結(jié)束值;變化值){

循環(huán)體;

}

如：

for(var i=0;i<5;i++){

alert(i); //循環(huán)到第幾次

}

循環(huán)結(jié)構(gòu)

2.while循環(huán)

當(dāng)條件滿足的時(shí)候，執(zhí)行循環(huán)體，當(dāng)不滿足的時(shí)候退出循環(huán)

while(表達(dá)式){

循環(huán)體;

}

先最少執(zhí)行一次，再進(jìn)行條件的判斷，如果條件滿足繼續(xù)執(zhí)行，如果不滿足則退出循環(huán)。

do{

}while(表達(dá)式)

循環(huán)結(jié)構(gòu)注意問(wèn)題

1.do{}while 和while的區(qū)別

while:當(dāng)條件滿足的時(shí)候，執(zhí)行循環(huán)體，當(dāng)不滿足的時(shí)候退出循環(huán),先判斷后執(zhí)行。

do{}while：先最少執(zhí)行一次，再進(jìn)行條件的判斷，如果條件滿足繼續(xù)執(zhí)行，如果不滿足則退出循環(huán)。

2.for 和while的區(qū)別

for一般是用于循環(huán)指定的次數(shù)

while是根據(jù)條件的真假來(lái)循環(huán)，當(dāng)真的時(shí)候進(jìn)行循環(huán)，假的時(shí)候退出循環(huán)。

循環(huán)結(jié)構(gòu)中的跳轉(zhuǎn)語(yǔ)句

在循環(huán)控制語(yǔ)句中，當(dāng) 滿足指定條件 的時(shí)候，退出循環(huán) 或者是退出 當(dāng)前 循環(huán)的語(yǔ)句。

1.break;

語(yǔ)法:break;

跳出并且終止循環(huán)，如果后面有代碼，則繼續(xù)往下執(zhí)行。

2.continue;

格式:continue;

跳出并且終止當(dāng)前的循環(huán)，如果下個(gè)值仍滿足循環(huán)條件，則繼續(xù)循環(huán)。

循環(huán)結(jié)構(gòu)中的跳轉(zhuǎn)語(yǔ)句

跳出多層循環(huán)

語(yǔ)法:

標(biāo)簽名:語(yǔ)句；

注意:標(biāo)簽名只可以作用于break 或continue

JavaScript函數(shù)

函數(shù):將完成某一特定功能的代碼集合起來(lái)，可以重復(fù)使用的代碼塊。

優(yōu)點(diǎn):

– 使程序更加簡(jiǎn)潔

– 邏輯性更調(diào)理

– 調(diào)用更方便

– 維護(hù)更加容易

函數(shù)的聲明方式(創(chuàng)建)

A.基本語(yǔ)法

function 關(guān)鍵字

function 函數(shù)名([參數(shù)1],[參數(shù)2]....){

函數(shù)體

[retrun] //返回值

}

B.字面量定義的形式(匿名函數(shù))

var 變量=function ([參數(shù)1],[參數(shù)2]....){

函數(shù)體

[retrun] //返回值

}

C.以對(duì)象的形式來(lái)聲明

new 關(guān)鍵字。

var 變量=new Function([參數(shù)1],[參數(shù)2]...,"函數(shù)體");

函數(shù)的調(diào)用方式

通過(guò)括號(hào)來(lái)調(diào)用

– 函數(shù)名()

– 變量名()

通過(guò)觸發(fā)事件來(lái)調(diào)用

– 對(duì)象.事件=function (){}

自調(diào)用

– (function (){})()

創(chuàng)建\調(diào)用函數(shù)注意問(wèn)題

如果兩個(gè)函數(shù)的命名相同，后面的將會(huì)覆蓋前面的函數(shù)。

以基本語(yǔ)法聲明的函數(shù)，會(huì)在頁(yè)面載入的時(shí)候提前解析到內(nèi)存中，以便調(diào)用。所以可以在函數(shù)的前面調(diào)用。但是以字面量形式命名的函數(shù)，會(huì)在執(zhí)行到他的時(shí)候，才進(jìn)行賦值。所以只能在函數(shù)的后面調(diào)用

在不同的<script></scricp>塊中，因?yàn)闉g覽器解析的時(shí)候是分塊解析的，所以前面的塊不能調(diào)用后面塊的函數(shù)，所以在不同的塊之間調(diào)用函數(shù)的時(shí)候，應(yīng)該先定義后調(diào)用。

帶有參數(shù)的函數(shù)

參數(shù)的作用:

可以動(dòng)態(tài)的改變函數(shù)體內(nèi)對(duì)應(yīng)的變量的值，使同一函數(shù)體得到不同的結(jié)果。

形參:在定義函數(shù)的時(shí)候，函數(shù)括號(hào)中定義的變量叫做形參。用來(lái)接受實(shí)參的。

實(shí)參:調(diào)用函數(shù)的時(shí)候，在括號(hào)中傳入的變量或值叫做實(shí)參。用于傳遞給形參.

參數(shù)詳解

參數(shù)的類型

– 可以是任何的數(shù)據(jù)類型。

參數(shù)的個(gè)數(shù)

– 實(shí)參和形參數(shù)量相等，一一對(duì)應(yīng)。

– 實(shí)參小于形參，不會(huì)報(bào)錯(cuò)，多出形參的值會(huì)自動(dòng)賦值為undefined

– 實(shí)參大于形參，不會(huì)報(bào)錯(cuò)，但如果要獲得多出實(shí)參的值，需要用arguments對(duì)象來(lái)獲取

arguments對(duì)象詳解

每創(chuàng)建一個(gè)函數(shù)，該函數(shù)就會(huì)隱式創(chuàng)建一個(gè)arguments對(duì)象，他包含有實(shí)際傳入?yún)?shù)的信息。

arguments對(duì)象的屬性

– length 獲得實(shí)參的個(gè)數(shù)

– callee 獲得函數(shù)本身的引用

– 訪問(wèn)傳入?yún)?shù)的具體的值。arguments[下標(biāo)]

模擬函數(shù)重載函數(shù)重載

– 同一個(gè)函數(shù)因?yàn)閰?shù)的類型或數(shù)量不同，可以對(duì)應(yīng)多個(gè)函數(shù)的實(shí)現(xiàn)，每種實(shí)現(xiàn)對(duì)應(yīng)一個(gè)函數(shù)體。

函數(shù)的返回值

return 語(yǔ)句

– 通過(guò)return 語(yǔ)句給函數(shù)一個(gè)返回值，停止并且跳出當(dāng)前的函數(shù)

return語(yǔ)句的用法

– 在return 語(yǔ)句后面的函數(shù)體內(nèi)所有內(nèi)容都不會(huì)輸出。

– 在函數(shù)體內(nèi)可以有多個(gè)return語(yǔ)句，但是只會(huì)執(zhí)行一個(gè)。(判斷語(yǔ)句)

return語(yǔ)句的返回值

– 返回值可以是任何的數(shù)據(jù)類型

– 只能返回一個(gè)返回值。

– 如果函數(shù)沒(méi)有返回值，那么這個(gè)函數(shù)的值就會(huì)自動(dòng)的賦值為undefined

變量的作用域

作用域:指的就是一段代碼的作用范圍。

全局變量在頁(yè)面中任何地方都能夠訪問(wèn)得到的變量，擁有全局的作用域。

A.函數(shù)的最外層定義的變量。

B.沒(méi)有定義直接賦值的變量，擁有全局屬性

局部變量

只能在固定的代碼片段(函數(shù)片段中)中訪問(wèn)到。

A.函數(shù)內(nèi)部定義的變量，就是局部變量。

B.參數(shù)也是局部變量。

*可以提高程序的邏輯性和安全性，減少名字的沖突。

作用域鏈

我們可以把所有作用域看成是有一個(gè)鏈條鏈接起來(lái)的，這樣能使變量和函數(shù)能夠有序有機(jī)的進(jìn)行運(yùn)行。

JavaScript代碼運(yùn)行環(huán)境

1.宿主環(huán)境

2.執(zhí)行環(huán)境

執(zhí)行的環(huán)境決定了變量和函數(shù)的作用域

A.全局環(huán)境

B.函數(shù)環(huán)境

JavaScript預(yù)解析順序

一、<script></script>塊依次解析。

二、解析代碼運(yùn)行的環(huán)境。

三、對(duì)標(biāo)識(shí)符(關(guān)鍵字)(var function )進(jìn)行解析，解析到相應(yīng)的環(huán)境下。

四、如果還有塊再按照上面的步驟依次解析。

JavaScript回調(diào)函數(shù)

通過(guò)函數(shù)的指針來(lái)調(diào)用函數(shù)。

– 把一個(gè)函數(shù)的指針做為另一個(gè)函數(shù)的參數(shù)，當(dāng)調(diào)用這個(gè)參數(shù)的時(shí)候，這個(gè)函數(shù)就叫做回調(diào)函數(shù)。

JavaScript遞歸函數(shù)

在函數(shù)內(nèi)部直接或間接的調(diào)用自己。

JavaScript內(nèi)嵌函數(shù)

在函數(shù)內(nèi)部再嵌套函數(shù)(閉包)