一篇文章帶你搞懂JavaScript的變量與數(shù)據(jù)類型
前言:
我不是搞前端,而是搞后端的。本命編程語(yǔ)言是java。學(xué)習(xí)js的嘛,因?yàn)榭吹绞矣涯茏龀鰟?dòng)態(tài)網(wǎng)頁(yè),而我只能做出靜態(tài)網(wǎng)頁(yè),再加上下個(gè)學(xué)期要學(xué)所以提前來(lái)學(xué)習(xí)學(xué)習(xí)。
溫馨提示:
java和javsScript沒(méi)有半毛錢(qián)關(guān)系,只是javaScript被SUN公司收購(gòu)后,把改成jaaScript,第一是因?yàn)镾UN的主打產(chǎn)品是java,第二是利用java的知名度去javaScript做廣告,擴(kuò)大javaScript的影響力。
接下來(lái)就分享今日的干貨
變量
什么是變量?
我們需要用編程語(yǔ)言去處理現(xiàn)實(shí)生活中的各種數(shù)據(jù),而各種數(shù)據(jù)又是存儲(chǔ)在哪里的呢?答案就是變量,變量不是什么高大尚的東西,它就是一個(gè)裝東西的盒子把它說(shuō)塑料袋也不為過(guò)。變量的本質(zhì)就是在內(nèi)存中開(kāi)辟一塊存放數(shù)據(jù)的空間。類似的我們酒店的房間,一個(gè)房間就可以看做一個(gè)變量。
變量的使用
變量使用時(shí)分為兩個(gè)步驟,1.聲明變量,2.賦值。我們還是用同樣的思想去理解這兩個(gè)步驟,有一天我來(lái)一家酒店,我向老板說(shuō)要開(kāi)一間單人房,當(dāng)我付錢(qián)后,老板給我房卡,這就意味著我在某一個(gè)期限內(nèi),可以入住那個(gè)房間。(我付錢(qián),老板給卡,相當(dāng)于聲明),我入住之后,空房間有人了相當(dāng)于賦值。
接下來(lái)看看JS中的變量的使用
1.聲明
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script> var age; </script> </head> <body> </body> </html>
- var 是js的一個(gè)關(guān)鍵字,用來(lái)聲明變量(variable變量的意思),使用該關(guān)鍵字聲明變量后,計(jì)算機(jī)自動(dòng)為變量分配內(nèi)存空間
- age程序員定義的變量名,我們要通過(guò)變量名來(lái)訪問(wèn)內(nèi)存中分配的空間
2.賦值
var age=19; //給age這個(gè)變量賦值為19
- =用來(lái)把右邊的值給左邊的變量空間,這就是賦值
- 變量值是程序員保存到空間變量里的值
3.二個(gè)語(yǔ)法小細(xì)節(jié)
更新變量:一個(gè)變量被重新賦值后,它原來(lái)的值就會(huì)被覆蓋,變量值以最后一次賦的值為準(zhǔn)
var age=18; age=19;//最后的結(jié)果為19.因?yàn)?8被19覆蓋了
同時(shí)聲明多個(gè)變量:只需寫(xiě)一個(gè)var ,然后變量名之間用英文逗號(hào)隔開(kāi)
var age,number,average;
聲明變量的特殊情況
特殊一
var sex;只聲明,不賦值,程序也不知道是啥,所以結(jié)果是 undefined (未定義的) console.log(sex);
特殊二
console.log(sex); 不賦值,不聲明,直接使用某個(gè)變量會(huì)報(bào)錯(cuò)
特殊三
qq=90; console.log(qq); 不聲明直接賦值直接用,不會(huì)報(bào)錯(cuò)?。。? 這就很離譜,但是在javaScript就是對(duì)的,因?yàn)樗杂闪恕?
變量的命名規(guī)范
- 有字母(AZ,az),下劃線_,美元符號(hào)$組成,如userName
- 嚴(yán)格區(qū)分大小寫(xiě)。var app;和var App;是兩個(gè)變量
- 不能以數(shù)字開(kāi)頭,如12age則是錯(cuò)誤的
- 不能是關(guān)鍵字,保留字,例如:var ,for ,while.
- 變量名必須有意義,要做到見(jiàn)名知意
- 遵循駝峰命名法:首字母大寫(xiě),后面的單詞首字母需要大寫(xiě)。如:myName
- 推薦翻譯網(wǎng)站:有道,或者直接百度
為什么需要數(shù)據(jù)類型?
編程語(yǔ)言是用來(lái)處理現(xiàn)實(shí)生活中的問(wèn)題,我們?cè)诂F(xiàn)實(shí)世界中要處理各種各樣的數(shù)據(jù),其中就有整數(shù),小數(shù),文字等等,對(duì)應(yīng)的在編程語(yǔ)言也有整數(shù),浮點(diǎn)數(shù),字符。在計(jì)算機(jī)中不同類型的數(shù)據(jù)所占的儲(chǔ)存空間也是不一樣的,為了方便把數(shù)據(jù)分為所需內(nèi)存大小不同的數(shù)據(jù),充分的利用儲(chǔ)存空間,于是就定義了不同的數(shù)據(jù)類型。簡(jiǎn)單的來(lái)說(shuō),數(shù)據(jù)類型就是數(shù)據(jù)的類別型號(hào),就是對(duì)數(shù)據(jù)分類。如姓名,“葉秋涵”,年齡18,這些數(shù)據(jù)的類型的就是不一樣的。
變量的數(shù)據(jù)類型
變量是用來(lái)儲(chǔ)存值的所在處,它們都有其名字和類型,變量的數(shù)據(jù)類型決定了如何將代表這些值的位儲(chǔ)存到計(jì)算機(jī)的內(nèi)存中,javaScript是一種弱類型或者說(shuō)動(dòng)態(tài)語(yǔ)言,這意味著不用提前聲明變量的
類型,程序在執(zhí)行過(guò)程中會(huì)自動(dòng)。
var age=10; //這是一個(gè)數(shù)字型 var name='葉秋涵'; //這是一個(gè)字符串
在代碼的運(yùn)行過(guò)程中,變量的數(shù)據(jù)類型是由js引擎根據(jù)=右邊變量值的數(shù)據(jù)類型來(lái)判斷的,運(yùn)行完畢之后,變量就確定了數(shù)據(jù)類型
?js擁有動(dòng)態(tài)類型,同時(shí)意味著相同的變量可以作不同的類型
var x=6; //x為數(shù)字 var x='嗶哩嗶哩'; //x為字符串
簡(jiǎn)單數(shù)據(jù)類型(基本數(shù)據(jù)類型)
js中的簡(jiǎn)單數(shù)據(jù)類型及其說(shuō)明
簡(jiǎn)單數(shù)據(jù)類型 | 說(shuō)明 | 默認(rèn)值 |
---|---|---|
Number | 數(shù)字型,包括整數(shù)值和浮點(diǎn)數(shù)值,如12,0.2022 | 0 |
Boolean | 布爾值是類型,如true,false,等價(jià)于1和0 | false |
String | 字符串類型,如"葉秋涵",注意在js中字符串都帶引號(hào) | “” |
Undefined | var a; 聲明變量a但是沒(méi)有給值,此時(shí)a=undefined | undefined |
Null | var a=null; 聲明a變量為空值 | null |
數(shù)字型
1.數(shù)字型進(jìn)制
最常見(jiàn)的進(jìn)制有二進(jìn)制,八進(jìn)制,十進(jìn)制,十六進(jìn)制
//1.八進(jìn)制數(shù)字序列范圍0~7 var num1=07; //對(duì)應(yīng)十進(jìn)制的7 var num2=019; //對(duì)應(yīng)十進(jìn)制的19 var num3=08 //對(duì)應(yīng)十進(jìn)制的8 //2.十六進(jìn)制數(shù)字序列范圍:0~9以及A~F var num=0xA;
現(xiàn)在我們只要記住,在js中八進(jìn)制前面加0,十六進(jìn)制前面加0x
2.數(shù)字型范圍
js中數(shù)值的最大值和最小值
alert(Number.MAX_SAFE_INTEGER);//9007199254740991 alert(Number.MIN_VALUE);//5e-324
3.數(shù)字型三個(gè)特殊值
alert(Infinity);//Infinity alert(-Infinity);//-Infinity alert(NaN);//NaN
- Infinity,代表無(wú)窮大,大于任何值
- -infinity,代表無(wú)窮小,小于任何值
- NaN, Not a number,代表一個(gè)非數(shù)值
字符串型 String
字符串型可以是引號(hào)中的任意文本,其語(yǔ)法是單引號(hào)**’'和雙引號(hào)""**
var srtAge = '18'; var strName = '葉秋涵'; var srtFood = '我愛(ài)垃圾食品'; //常見(jiàn)錯(cuò)誤 var srtNum2 = 11; //報(bào)錯(cuò),沒(méi)有引號(hào),會(huì)被認(rèn)為是js代碼,但是js沒(méi)有這些語(yǔ)法
因?yàn)樵贖TML標(biāo)簽中里面的屬性使用的是雙引號(hào),js這里我們更推薦使用單引號(hào)
字符串引號(hào)嵌套
js可以用單引號(hào)嵌套雙引號(hào),或者用雙引號(hào)嵌套單引號(hào)(外雙內(nèi)單,內(nèi)單外雙)
var strMsy = '我是"程序員"蕭寒'; console.log(strMsy) var strMsy2 = "我是'程序員'蕭寒"; console.log(strMsy2); //常見(jiàn)錯(cuò)誤 var badQuotes = "What on earth?"'; console.log(strMsy2);
結(jié)果如下
字符串轉(zhuǎn)義符
類似HTML里面的特殊字符,字符串中也有特殊字符,我們稱為轉(zhuǎn)義符
轉(zhuǎn)義符都是由\開(kāi)頭,常用的轉(zhuǎn)義字符及其說(shuō)明如下
轉(zhuǎn)義符 | 解釋說(shuō)明 |
---|---|
\n | 換行符,n是newline的意思 |
\ \ | 斜杠\ |
\ ’ | 單引號(hào) |
\ * | 雙引號(hào) |
\t | tab縮進(jìn) |
\b | 空格 ,b是blank的意思 |
布爾型Boolean
布爾類型有兩個(gè)值,true和false,其中true表示真,而false表示假
布爾型和數(shù)字型相加的時(shí)候,true的值為1,false的值為0
console.log(true+1);//2 console.log(false+0);//0
Undefined和Null
一個(gè)聲明后沒(méi)有被賦值的變量會(huì)默認(rèn)有一個(gè)默認(rèn)值undefined(如果進(jìn)行相加或者相連時(shí),注意結(jié)果)
var variable; console.log(variable); console.log('你好'+variable); console.log(11+variable);//+起連接作用 console.log(true+variable);
結(jié)果如下
?一個(gè)變量給null值,里面儲(chǔ)存的值為空,就是啥也沒(méi)有
var vari=null; console.log('你好'+vari); console.log(11+vari); console.log(true+vari);
結(jié)果如下
什么是數(shù)據(jù)類型的轉(zhuǎn)換
使用表單,prompt獲取過(guò)來(lái)的數(shù)據(jù)默認(rèn)值是字符串類型,此時(shí)就不能進(jìn)行簡(jiǎn)單的加法運(yùn)算,而是需要轉(zhuǎn)換變量的數(shù)據(jù)類型,簡(jiǎn)單來(lái)說(shuō),就是把一種數(shù)據(jù)類型轉(zhuǎn)換成另一種數(shù)據(jù)類型。
三種常用的轉(zhuǎn)換方式
- 轉(zhuǎn)換為字符類型
- 轉(zhuǎn)換為數(shù)字型
- 轉(zhuǎn)換為布爾型
1.轉(zhuǎn)換為字符串
方式 | 說(shuō)明 | 案例 |
---|---|---|
toString() | 轉(zhuǎn)換為字符串 | var num=1; alert(num.toString()); |
String()強(qiáng)制轉(zhuǎn)換 | 轉(zhuǎn)換為字符串 | var num=1; alert(String(num)); |
加號(hào)拼接字符串 | 和字符串拼接的結(jié)果是字符串 | var num=1; alert(num+“我是字符串”); |
- toString()和String()使用放方式一樣
- 三種轉(zhuǎn)換方式,前面兩種了解,第三種轉(zhuǎn)換為常用,也成為隱形轉(zhuǎn)換
2.轉(zhuǎn)換為數(shù)字型(重點(diǎn))
(一)利用js提供的函數(shù)
js提供了parseInt()和parseFloat()兩個(gè)轉(zhuǎn)換函數(shù)。前者把值轉(zhuǎn)換成整數(shù),后者把值轉(zhuǎn)換成浮點(diǎn)數(shù)。
看看代碼就明白了
var age=12; console.log(age); //利用parseInt()將值轉(zhuǎn)換為整數(shù) console.log(parseInt(age)); console.log(parseInt('3.12'));//取整 console.log(parseInt('3.89'));//取整 console.log(parseInt('10px')); console.log(parseInt('rem120px'))//NaN //利用parseFloat()將值轉(zhuǎn)換為整數(shù) console.log(parseFloat('3.14'));//3.14 console.log(parseFloat('120px'));//120會(huì)去掉px這個(gè)單位 console.log(parseFloat('rem102px'));//NaN js引擎讀到rem的時(shí)候,無(wú)法識(shí)別,直接判為空
(二)強(qiáng)制轉(zhuǎn)換 Number()轉(zhuǎn)換函數(shù)
var str='123'; console.log(Number(str));//123 console.log(Number('12'));//12
(三)js的隱形轉(zhuǎn)換(- * /) 注意沒(méi)有+,+起拼接作用
console.log('12'-0);//12 console.log('122'+1);//1221 console.log('123'*123);//15129 console.log('123'/123);//1
轉(zhuǎn)化為布爾型
方式 | 說(shuō)明 | 案例 |
---|---|---|
Boolean()函數(shù) | 其它類型轉(zhuǎn)換為布爾值 | Boolean(‘true’) |
- 代表空,否定的值會(huì)被轉(zhuǎn)換為false,如’’,0,NaN,null,undefined
- 其余值都會(huì)轉(zhuǎn)換為true
console.log('');//false console.log(0);//false console.log(NaN);//false console.log(null);//false console.log(undefined);//false console.log('小白');//true console.log(12);//true
總結(jié)
本篇文章就到這里了,希望能夠給你帶來(lái)幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
javascript中聲明函數(shù)的方法及調(diào)用函數(shù)的返回值
這篇文章主要介紹了javascript中聲明函數(shù)的方法及調(diào)用函數(shù)時(shí)的返回值,示例如下,不了解的方法可以參考下2014-07-07JavaScript bold方法入門(mén)實(shí)例(把指定文字顯示為粗體)
這篇文章主要介紹了JavaScript字符串對(duì)象的bold方法入門(mén)實(shí)例,bold方法用于把指定文字顯示為粗體,需要的朋友可以參考下2014-10-10javascript學(xué)習(xí)筆記(十七) 檢測(cè)瀏覽器插件代碼
javascript學(xué)習(xí)筆記之檢測(cè)瀏覽器插件代碼,需要的朋友可以參考下2012-06-06JavaScript字符串對(duì)象的concat方法實(shí)例(用于連接兩個(gè)或多個(gè)字符串)
這篇文章主要介紹了JavaScript字符串對(duì)象的concat方法實(shí)例,這個(gè)方法用于連接兩個(gè)或多個(gè)字符串,平時(shí)用+號(hào)比較多,所以這個(gè)方法可能不太常用,需要的朋友可以參考下2014-10-10淺析javascript中function 的 length 屬性
length 屬性可返回字符串中的字符數(shù)目。而function中l(wèi)ength獲取為一個(gè)函數(shù)定義的參數(shù)數(shù)目。2014-05-05