《JavaScript DOM編程藝術(shù)》——javascript基礎(chǔ)語(yǔ)法

1、JavaScript有兩種方式使文檔進(jìn)行執(zhí)行。

(1)將JavaScript代碼放在HTML文檔的<head>標(biāo)簽的<script>
(2)更好的一種方法是新建一個(gè)擴(kuò)展名為.js的獨(dú)立文件,放在一個(gè)<script>標(biāo)簽里
語(yǔ)法:<script src="file.js"></script>

建議將<script>標(biāo)簽放在HTML文檔的最后,</body>標(biāo)簽之前。

2、語(yǔ)法

2、1語(yǔ)句

建議在每條語(yǔ)句的末尾加上一個(gè)分號(hào)。

2、2注釋

//用兩條斜線開(kāi)頭,則將這一行定義為注釋。
對(duì)于javascript文件中"<!--"和"http://"的處理是一樣的
/*多行注釋的格式*/

2、3變量

把值存入變量的操作稱為賦值。
對(duì)變量聲明的示例:

var mood;var age;
var mood="happy", age=33;```
在javascript中語(yǔ)法元素的名字都是區(qū)分字母大小寫的。
不允許變量名中包含空格或標(biāo)點(diǎn)符號(hào)。
允許包含字母、數(shù)字、美元符號(hào)$和下劃線(但第一個(gè)字符不允許是數(shù)字)
使用駝峰格式,`var myMood="happy";`
*駝峰格式是函數(shù)名、方法名和對(duì)象屬性名的首選格式*
######2、4數(shù)據(jù)類型
1)字符串
字符串由零個(gè)或多個(gè)字符構(gòu)成。包括字母,數(shù)字,標(biāo)點(diǎn)符號(hào)和空格。字符串必須在引號(hào)里
`var mood="happy";var mood='happy';`
在javascript中用反斜線對(duì)字符進(jìn)行轉(zhuǎn)義
`var mood='don\'t ask';var height="about 5'10\"tall";`
2)數(shù)值
有小數(shù)的數(shù)字為浮點(diǎn)數(shù)(floating-point number)
`var age =33.25;`
3)布爾值
布爾(boolean)類型
只有兩個(gè)可選值:true或false
######2、5數(shù)組
 數(shù)組是指用一個(gè)變量表示一個(gè)值的集合集合中的每個(gè)值都是這個(gè)數(shù)組的一個(gè)元素。
在JS中用關(guān)鍵字Array聲明。
數(shù)組的下標(biāo)是從0開(kāi)始計(jì)數(shù)的。
```javascript
var beatles=Array("John","Paul","George","Ringo");
var beatles=["John","Paul"];```
可以用不著明確地表明我們?cè)趧?chuàng)建數(shù)組,只需要一對(duì)方括號(hào)把各個(gè)元素的初始值括起來(lái)。
存放數(shù)據(jù)的首選方法:將數(shù)據(jù)保存為對(duì)象。
######2、6對(duì)象
```javascript
var lennon=object();lennon.name="John";lennon.year=1940;lennon.living=false;```
更加簡(jiǎn)潔的寫法
`var lennon={name:"John",year:1940,};`
####3、操作
>算數(shù)操作符
算數(shù)操作(arithmetic operation)
操作符(operator)
i=i+1  i++(表示加一)
i--累減

`var message="I am feel"+"happy";`
把多個(gè)字符串首尾相連在一起的操作叫做
拼接(concatenation)
      如果把字符串和數(shù)值拼接在一起,其結(jié)果將是一個(gè)更長(zhǎng)的**字符串**;但如果用同樣的操作符來(lái)"拼接"兩個(gè)數(shù)值,其結(jié)果將是兩個(gè)數(shù)值的**算術(shù)和**
`alert("10"+20);alert(10+20);`
第一條語(yǔ)句返回字符串"1020"
第二條語(yǔ)句返回?cái)?shù)值30
+=(加法和賦值操作)x+=y等價(jià)于x=x+y
####4、條件語(yǔ)句
if語(yǔ)句
if基本語(yǔ)法
`if(condition){
statements;
}`
條件必須放在if后面的圓括號(hào)中,條件的求值結(jié)果永遠(yuǎn)是一個(gè)布爾值,**(true或false)**
花括號(hào)中的語(yǔ)句,只有在給定條件的求值結(jié)果是true的情況下才會(huì)執(zhí)行。
當(dāng)花括號(hào)中的語(yǔ)法只有一句時(shí),可以不使用花括號(hào),而且這條if語(yǔ)句全部?jī)?nèi)容可以寫在同一行上。
```javascript
if(1>2)alert("the world has gone mad!")```
if語(yǔ)句可以有一個(gè)else子句,包含在else子句中的語(yǔ)句會(huì)在給定條件為假時(shí)執(zhí)行。
```javascriptif
(1>2){alert("the world has gone mad");}else{alert("All is well with the world");}```
######4、1比較操作符
>大于>
小于<
大于或等于>=
小于或等于<=
等于==    
嚴(yán)格比較相等===
不等于!=   
嚴(yán)格不等于!==

*嚴(yán)格比較相等不僅比較值,而且比較變量的類型*
######4、2邏輯操作符
>“邏輯與”操作符:&&
“邏輯或”操作符:||
“邏輯非”操作符:!

邏輯非操作符可以把整個(gè)條件語(yǔ)句的結(jié)果顛倒過(guò)來(lái)
```JavaScript
if(!(num>10||num<5)){
alert(“the number is in the right range.”);```
####5循環(huán)語(yǔ)句
循環(huán)語(yǔ)句可以讓我們反復(fù)多次的執(zhí)行同一段代碼。
***
#####5、1  while循環(huán)
語(yǔ)法
```javascript
while (condition) {
statements;
}```
>while與if的區(qū)別是:只要給定條件的求值結(jié)果是true,包含在花括號(hào)里的代碼將反復(fù)地執(zhí)行下去。

**do ...while循環(huán)**
```javascript
do{
statements;
}while (condition);```
```javascript
var count=1;
do {
alert (count);
count++;
}while (count <1);```
>由于do循環(huán)的循環(huán)控制條件出現(xiàn)在花括號(hào)部分之后,所以包含在這個(gè)do循環(huán)內(nèi)部的代碼還是執(zhí)行了一次。其結(jié)果是2

#####5.2   for循環(huán)
類似于while循環(huán),與循環(huán)有關(guān)的所有內(nèi)容都包含在for語(yǔ)句的圓括號(hào)部分
```javascript
for(var count=1;count<11;count++){
alert(count);
}```
>for循環(huán)的常見(jiàn)用途之一是對(duì)某個(gè)數(shù)組內(nèi)的全體元素進(jìn)行遍歷處理。

####6、函數(shù)
如果需要多次使用同一代碼,可以把它封裝成一個(gè)函數(shù)。函數(shù)(function)就是一組允許在你的代碼隨時(shí)調(diào)用的語(yǔ)句。每個(gè)函數(shù)都是一個(gè)短小的腳本。
***
函數(shù)示例
```javascript
function shout(){
var beatles=Array("John","George","Ringo");
for (var count=0;count<beatles.length;count++){
alert(beatles[count]);
 }
}```
這個(gè)函數(shù)循環(huán)語(yǔ)句將依次彈出對(duì)話框來(lái)顯示Beatles樂(lè)隊(duì)成員的名字。如果想在自己的腳本里隨時(shí)執(zhí)行這個(gè)動(dòng)作,可以隨時(shí)調(diào)用`shout();`這個(gè)函數(shù)。
我們把傳遞給函數(shù)的數(shù)據(jù)稱為**參數(shù)**(argument)
在定義函數(shù)時(shí),你可以為它聲明任意多個(gè)參數(shù),只要用逗號(hào)把他們分割開(kāi)來(lái)就行,在函數(shù)內(nèi)部你就可以像使用普通變量那樣使用它的任何一個(gè)參數(shù)。
```javascript
function multiply(num1,num2) {
var total=num1*num2;
alert(total);
}```
在定義好的腳本里我們可以在任意位置去調(diào)用這個(gè)函數(shù)。
例如`multiply(10,2);`把數(shù)值10和2傳遞給multiply()函數(shù)。
***
如果上例的函數(shù)結(jié)果能夠返回給調(diào)用這個(gè)函數(shù)的語(yǔ)句往往會(huì)更有用。
需要用到renturn語(yǔ)句
```javascript
function convertToCelsius(temp){
var result=-32;
result=result/1.8;
return total;
}
//函數(shù)只有一個(gè)參數(shù)(一個(gè)華氏溫度值),它將返回一個(gè)數(shù)值(同一溫度的攝氏溫度值)```
我們可以把函數(shù)當(dāng)做是一種數(shù)據(jù)類型來(lái)使用,可以把函數(shù)的調(diào)用結(jié)果賦給一個(gè)變量。
```javascript
var temp_fahrenheit=95;
avr temp_celsius+convertToCelsius(temp_fahrenheit);
alert(temp_celsius);
//變量temp_celsius的值將是35,這個(gè)值由converToCelsius函數(shù)返回```
- 在命名函數(shù)時(shí),我們采用駝峰命名法。
- 在命名變量時(shí),用下劃線來(lái)分隔每個(gè)單詞。

####變量的作用域
變量可以是全局的,也可以是局部的。
- 全局變量(global variable)

可以在腳本中的任何位置被引用。一旦你在某個(gè)腳本里聲明了一個(gè)全局變量,就可以在這個(gè)腳本中的任何位置(包括函數(shù)內(nèi)部)引用它。全局變量的作用域是整個(gè)腳本
- 局部變量

**只存在于聲明它的那個(gè)函數(shù)的內(nèi)部**該函數(shù)外部是無(wú)法引用它的,其作用域僅限于某個(gè)特定的函數(shù)。
可以用var關(guān)鍵字明確的設(shè)定作用域。
**在一個(gè)函數(shù)中**使用了`var`這個(gè)變量將被視為一個(gè)局部變量,只存在于該函數(shù)的上下文中;反之,如果沒(méi)有使用`var`這個(gè)變量將被視為一個(gè)全局變量
我們來(lái)看下面的例子:
```javascript
function squre(num){
total=num*num;
return total;
}
var total=50;
var number=square(20);
alert(total);
//全局變量total變成了400,本意是讓square()函數(shù)之把它計(jì)算出來(lái)的平方值返回給變量number,由于未把函數(shù)內(nèi)部的total變量聲明為局部變量這個(gè)函數(shù)把名字同樣是total的那個(gè)全局變量的值也改變了。
  • tips
    在定義函數(shù)時(shí),我們一定要把它內(nèi)部的變量全都明確的聲明為局部變量。建議在函數(shù)里使用var關(guān)鍵字來(lái)定義變量,養(yǎng)成良好的編程習(xí)慣

對(duì)象

對(duì)象(object)是自包含的數(shù)據(jù)集合,包含在對(duì)象里的數(shù)據(jù)可以通過(guò)兩種形式訪問(wèn)——屬性(property)方法(method)
?- 屬性是隸屬于某個(gè)特定對(duì)象的變量;
?- 方法是只有某個(gè)特定對(duì)象才能調(diào)用的函數(shù)。
對(duì)象就是由一些屬性和方法組合在一起而構(gòu)成的一個(gè)數(shù)據(jù)實(shí)體。
在JavaScript中,屬性和方法都使用“點(diǎn)”語(yǔ)法訪問(wèn)

object.property
object.method( )

實(shí)例(instance)
為給定對(duì)象創(chuàng)建一個(gè)新實(shí)例需要使用new關(guān)鍵字。

var Jeremy= new person;

內(nèi)建對(duì)象
可以直接拿來(lái)就用的對(duì)象稱為內(nèi)建對(duì)象(native object)
數(shù)組就是常見(jiàn)的一種內(nèi)建對(duì)象,還有Math對(duì)象和Date對(duì)象。

var num = 7.561;
var num =Math.round(num);
alert(num);
Math對(duì)象的round方法可以把十進(jìn)制數(shù)值舍入為一個(gè)與之最接近的整數(shù)

Date對(duì)象可以用來(lái)存儲(chǔ)和檢索與特定日期和時(shí)間有關(guān)的信息。
Date對(duì)象提供了getDay( )、getHours( )、getMonth( )等一系列方法,以供人們用來(lái)檢索與特定日期有關(guān)的各種信息。

在編寫JavaScript腳本時(shí),內(nèi)建對(duì)象可以幫助我們快速、簡(jiǎn)單地完成許多任務(wù)。

宿主對(duì)象
由瀏覽器提供的預(yù)定義對(duì)象被稱為宿主對(duì)象(host object)
宿主對(duì)象包括Form、Image、Element等。我們可以通過(guò)這些對(duì)象獲得關(guān)于網(wǎng)頁(yè)上表單,圖像和各種表單元素等信息。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容