avaScript基礎(chǔ)學(xué)習(xí)-基本的語法規(guī)則
一、運(yùn)算符
- js中的+-*/運(yùn)算與c語言較為相似,簡寫方式也類似
- ++、--、+=、%=等運(yùn)算規(guī)則也相同
- 在js中===代表絕對等于(值與類型都相同才算相同)
- !==(不絕對等于)值和類型有一個不相同或者都不相同為真
- js中還支持三目運(yùn)算符
- a>b?'a大于b':'b大于a'
二、分支語句
js中的條件語句 :
if分支:
? ? ?if ? ? ?if...else... ? ? ?if...else if..else...
switch分支:
? ? ?switch() ? ? ?{ ? ? ? ? ?case 1: ? ? ? ? ? ?{} ? ? ? ? ? ?break; ? ? ? ? ?case 2: ? ? ? ? ? ?{} ? ? ? ? ? ?break; ? ? ? ? ?default:{}//默認(rèn)情況 ? ? ?}
三、循環(huán)語句
- for(初始條件;終止條件;循環(huán)變量的變化)
- for/in循環(huán)遍歷對象的屬性
- while
- do/while
- break
- continue
- 與c語言非常類似
<!--
break的另一種用法
label:
語句塊
...
break labelname;
跳出指定的標(biāo)簽塊
-->
四、異常的捕獲與處理
捕捉異常
try{}
捕捉到異常后執(zhí)行的語句
catch(err){}
無論是否會有異常,最后執(zhí)行的語句
finally{}
五、js中的this關(guān)鍵字
面向?qū)ο笳Z言中 this 表示當(dāng)前對象的一個引用。 但在 JavaScript 中 this 不是固定不變的,它會隨著執(zhí)行環(huán)境的改變而改變。在方法中,this 表示該方法所屬的對象。 如果單獨(dú)使用,this 表示全局對象。
- 在函數(shù)中,this 表示全局對象。在函數(shù)中,在嚴(yán)格模式下,this 是未定義的(undefined)
- 在事件中,this 表示接收事件的元素。 類似 call() 和 apply() 方法可以將 this 引用到任何對象。
apply 和 call 允許切換函數(shù)執(zhí)行的上下文環(huán)境(context),即 this 綁定的對象,可以將 this 引用到任何對象。
代碼如下:
<!DOCTYPE html> <html lang="en"> <head> ? ? <meta charset="UTF-8"> ? ? <meta http-equiv="X-UA-Compatible" content="IE=edge"> ? ? <meta name="viewport" content="width=device-width, initial-scale=1.0"> ? ? <title>Document</title> </head> <body> ? ? <p id="demo"></p> ? ? <p id="demo1"></p> ? ? <script> ? ? ? ? var p1={ ? ? ? ? ? ? firname:"阿薩德", ? ? ? ? ? ? age:"28", ? ? ? ? ? ? f:function() { ? ? ? ? ? ? ? ? return this.firname+" "+this.age; ? ? ? ? ? ? } ? ? ? ? } ? ? ? ? var p2={ ? ? ? ? ? ? firname:"張三", ? ? ? ? ? ? age:"20" ? ? ? ? } ? ? ? ? x=p1.f.call(p2) ? ? ? ? xx=p1.f.call(p1) ? ? ? ? document.getElementById("demo").innerHTML=x ? ? ? ? document.getElementById("demo1").innerHTML=xx ? ? </script> </body> </html>
六、let與const定義變量使用規(guī)則
const定義常量與使用let 定義的變量相似:
- 二者都是塊級作用域
- 都不能和它所在作用域內(nèi)的其他變量或函數(shù)擁有相同的名稱
兩者還有以下兩點(diǎn)區(qū)別:
-
const
聲明的常量必須初始化,而let聲明的變量不用 - const 定義常量的值不能通過再賦值修改,也不能再次聲明。
- 而 let 定義的變量值可以修改。
let聲明的變量:
在不同的{}內(nèi)可以使用let定義不同的變量,var不行,而且let定義的變量不能使用var再次定義,var定義的變量也不能使用let再次定義, const與var、const與let同樣,使用var關(guān)鍵字聲明的全局作用域變量屬于window對象。
- 使用let關(guān)鍵字聲明的全局作用域變量不屬于window對象。
- 使用var關(guān)鍵字聲明的變量在任何地方都可以修改。
- const可以一次定義多個常量值,并且每個常量值的名字不相同
- const指向的對象不可以改變,但是對象指向的東西可以改變
? myarray=["1","2","3"] ? ? ? ? myarray[0]="100"http://正確 ? ? ? ? myarray=["2","3"]//錯誤
- const聲明的常量可以在不同塊作用級重新聲明和賦值
- 可以使用
Object.freeze()
方法來 凍結(jié)變量 (指向與內(nèi)容都不可變 - const與let都是先聲明后使用
代碼如下:
<!DOCTYPE html> <html lang="en"> <head> ? ? <meta charset="UTF-8"> ? ? <meta http-equiv="X-UA-Compatible" content="IE=edge"> ? ? <meta name="viewport" content="width=device-width, initial-scale=1.0"> ? ? <title>Document</title> </head> <body> ? ? <p id="demo"></p> ? ? <p id="demo1"></p> ? ? <p id="demo2"></p> ? ? <script> ? ? ? ? let x=10; ? ? ? ? var x1=10; ? ? ? ? // 用const修飾的變量被修改后會報錯 ? ? ? ? const x2=10 ? ? ? ? x=11; ? ? ? ? x1=11; ? ? ? ? // x2=11; ? ? ? ? document.getElementById("demo").innerHTML=x; ? ? ? ? document.getElementById("demo1").innerHTML=x1; ? ? ? ? document.getElementById("demo2").innerHTML=x2; ? ? </script> </body> </html>
七、js中的void鏈接
javascript:void(0)與#+id的本質(zhì)區(qū)別
- 前者不會改變網(wǎng)頁的url,而后者會將url定位到#+id
語法格式如下:
void func()
javascript:void func()
或者:
void(func())
javascript:void(func())
-
javascript:void(0)
中最關(guān)鍵的是 void 關(guān)鍵字, void 是 JavaScript 中非常重要的關(guān)鍵字,該操作符指定要計算一個表達(dá)式但是不返回值。href="#"與href="javascript:void(0)"
的區(qū)別# 包含了一個位置信息,默認(rèn)的錨是#top 也就是網(wǎng)頁的上端。 而javascript:void(0), 僅僅表示一個死鏈接。在頁面很長的時候會使用 # 來定位頁面的具體位置,格式為:# + id
。
如果你要定義一個死鏈接請使用 javascript:void(0)
??梢允褂?code>javascript:void()執(zhí)行想要的函數(shù),彈窗,等等
語法規(guī)則:
? <a href="javascript:void(0);" rel="external nofollow" >點(diǎn)我</a> ? <a href="#demo" rel="external nofollow" >回頂部</a>
八、異步編程setTimeout
異步(Asynchronous, async)
是與同步(Synchronous, sync)
相對的概念。在我們學(xué)習(xí)的傳統(tǒng)單線程編程中,程序的運(yùn)行是同步的(同步不意味著所有步驟同時運(yùn)行,而是指步驟在一個控制流序列中按順序執(zhí)行)。而異步的概念則是不保證同步的概念,也就是說,一個異步過程的執(zhí)行將不再與原有的序列有順序關(guān)系。
簡單來理解就是:同步按你的代碼順序執(zhí)行,異步不按照代碼順序執(zhí)行,異步的執(zhí)行效率更高。
回調(diào)函數(shù)就是一個函數(shù),它是在我們啟動一個異步任務(wù)的時候就告訴它:等你完成了這個任務(wù)之后要干什么。這樣一來主線程幾乎不用關(guān)心異步任務(wù)的狀態(tài)了,他自己會善始善終。啟用回調(diào)函數(shù) setTimeout("函數(shù)名",間隔時間(毫秒))可以將函數(shù)定義到setTimeout函數(shù)內(nèi)
代碼如下:
<!DOCTYPE html> <html lang="en"> <head> ? ? <meta charset="UTF-8"> ? ? <meta http-equiv="X-UA-Compatible" content="IE=edge"> ? ? <meta name="viewport" content="width=device-width, initial-scale=1.0"> ? ? <title>Document</title> </head> <body> ? ? <p>回調(diào)函數(shù)等待 3 秒后執(zhí)行。</p> ? ? <p id="demo"></p> ? ? <p id="demo1"></p> ? ? <p id="demo3"></p> ? ? <p id="demo4"></p> <script> ? ? // 第一種方式 ? ? function print() { ? ? ? ? document.getElementById("demo").innerHTML="666"; ? ? } ? ? //這里是定時三秒 ? ? setTimeout(print, 3000); ? ? // 第二種方式 ? ? setTimeout(function () { ? ? document.getElementById("demo1").innerHTML="666"; ? ? }, 3000); ? ? // 測試 ? ? // 主線程先打印出來,子線程繼續(xù)接上 ? ? setTimeout(function () { ? ? document.getElementById("demo3").innerHTML="-1!"; ? ? }, 3000); ? ? document.getElementById("demo4").innerHTML="-2!"; ? ? console.log("2"); </script> </body> </html>
九、函數(shù)閉包
- 閉包是一種保護(hù)私有變量的機(jī)制,在函數(shù)執(zhí)行時形成私有的作用域,
- 保護(hù)里面的私有變量不受外界干擾。直觀的說就是形成一個不銷毀的棧環(huán)境。
代碼如下:
<!DOCTYPE html> <html lang="en"> <head> ? ? <meta charset="UTF-8"> ? ? <meta http-equiv="X-UA-Compatible" content="IE=edge"> ? ? <meta name="viewport" content="width=device-width, initial-scale=1.0"> ? ? <title>Document</title> </head> <body> ? ? <script> ? ? ? ? var add = (function () { ? ? ? ? ? ? var count = 0; ? ? ? ? ? ? return function(){return count+=1;} ? ? ? ? })(); ? ? ? ? function f(){ ? ? ? ? ? ? document.getElementById("demo").innerHTML=add(); ? ? ? ? } ? ? </script> ? ? <div id="demo"></div> ? ? <button type="button" onclick="f()">點(diǎn)擊加一</button> </body> </html>
總結(jié):
這些都只是js的一些入門語法,想要學(xué)好還需細(xì)細(xì)的斟酌,
到此這篇關(guān)于avaScript基礎(chǔ)學(xué)習(xí)-基本的語法規(guī)則的文章就介紹到這了,更多相關(guān)avaScript語法規(guī)則內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JS辨別訪問瀏覽器判斷是android還是ios系統(tǒng)
掃描二維碼之后自動分辨出是android還是ios系統(tǒng),因此就要用JS辨別訪問瀏覽器針對于不同的系統(tǒng)進(jìn)行不同的下載,需要的朋友可以參考下2014-08-08瀏覽器環(huán)境下JavaScript腳本加載與執(zhí)行探析之defer與async特性
defer和async特性相信是很多JavaScript開發(fā)者"熟悉而又不熟悉"的兩個特性,從字面上來看,二者的功能很好理解,分別是"延遲腳本"和"異步腳本"的作用2016-01-01JavaScript實(shí)現(xiàn)計算多維嵌套數(shù)組深度
在前端開發(fā)中,經(jīng)常會遇到需要處理多維嵌套的數(shù)據(jù)結(jié)構(gòu),并需要計算出它們的深度,本文就來講講如何使用JavaScript實(shí)現(xiàn)計算多維嵌套數(shù)組深度吧2023-06-06