前端三層.png
一、基礎(chǔ)語(yǔ)法
（一）Javascript書(shū)寫(xiě)位置
- 在<body>中<script></script>標(biāo)簽對(duì)內(nèi)，書(shū)寫(xiě)Javascript代碼
- 將代碼單獨(dú)保存在.js格式文件中，在html文件中時(shí)間<script></script>的形式引入它
這個(gè)極其簡(jiǎn)單，就不舉例了。
(二) 認(rèn)識(shí)輸出語(yǔ)句
alert()語(yǔ)句，彈出一個(gè)警告框
consolo.log（） 控制臺(tái)輸出
/*字符串顯示需要用引號(hào)包括
* 語(yǔ)句末尾書(shū)寫(xiě)英文狀態(tài)下的分號(hào)
*/
<script>alert("開(kāi)始學(xué)習(xí)javascript!");</script>
alert效果.png
<script>console.log("在調(diào)試控制臺(tái)才能看到我！");</script>
console顯示.png
二、變量
- 變量是計(jì)算機(jī)語(yǔ)言中能儲(chǔ)存計(jì)算機(jī)結(jié)果或能表示值的抽象概念。
- 變量不是數(shù)值本身，它是一個(gè)用于存儲(chǔ)數(shù)值的容器
（一）定義變量
- 第一步：聲明，并賦值
var a = 10;
使用var關(guān)鍵字定義變量，=表示賦值
es6 使用let = 10; 暫時(shí)不討論這個(gè)，進(jìn)入ES6再研究這個(gè)。 - 第二步，變量被賦值后，就可以使用了；
console.log(a);
(二)改變變量的值
- 變量的值可以被改變，后續(xù)使用不再需要書(shū)寫(xiě)聲明關(guān)鍵字
var.
var a = 10; //定義變量a，并賦初值為10
a = 18; //更改變量a的值為18
console.log(a) // 18
（三)變量的命名
- 只能由字母、數(shù)字、下劃線、$符號(hào)組成，但不能以數(shù)字開(kāi)頭。
- 不能是javascript關(guān)鍵字或保留字，
- 變量名大小寫(xiě)敏感。
這也是Javascript標(biāo)識(shí)符的命名規(guī)則，函數(shù)、類(lèi)名、對(duì)象的屬性等也遵循這個(gè)規(guī)則
** 優(yōu)秀變量命名法：**
- 駝峰命名法：
myVariable建議使用 - C風(fēng)格：
my_variable
(四)變量的默認(rèn)值
- 一個(gè)變量只定義，不賦初值，默認(rèn)值是
undefined - 一個(gè)變量只有被var定義，并賦初值之后，才算正式初始化完成。
(五)變量聲明提升
變量聲明提升：提前使用一個(gè)稍后才聲明的變量，而不發(fā)生異常
- 在執(zhí)行所有代碼前,javascript有一個(gè)預(yù)解析階段，會(huì)于都所有變量的定義
三、Javascript基本數(shù)據(jù)類(lèi)型
數(shù)據(jù)類(lèi)型簡(jiǎn)介與檢測(cè)
兩大類(lèi)：基本數(shù)據(jù)類(lèi)型 & 復(fù)雜數(shù)據(jù)類(lèi)型
- 基本數(shù)據(jù)類(lèi)型：Number 、String、Boolean、Undefined、Null
- 復(fù)雜數(shù)據(jù)類(lèi)型：Object、Array、Function、RegExp、Date、Map、Set等等
typeof運(yùn)算符
使用
typeof運(yùn)算符可以檢值或變量的類(lèi)型
var a = 10;
console.log(typeof a); //number
var b = 'this is javascript';
console.log(typeof b) //string
5種基本數(shù)據(jù)類(lèi)型typeof檢測(cè)結(jié)果
typeof檢測(cè)結(jié)果.png
基本數(shù)據(jù)類(lèi)型
（一）Number(數(shù)字)類(lèi)型
- 所有數(shù)字不分大小、部分整浮、部分正負(fù)，都是數(shù)字類(lèi)型
var a=10; var b= 3.1415926; var c = -12; var d = 0b10; - 特殊數(shù)字類(lèi)型NaN.
NaN即“not a number”，字面意思“不是一個(gè)數(shù)”，但它市一個(gè)數(shù)字類(lèi)型的值。
Javascript數(shù)學(xué)運(yùn)算中，若結(jié)果不能得到數(shù)字，其結(jié)果往往都是NaN。
NaN 不自等。
（二）String(字符串)類(lèi)型
- 字符串就是“人類(lèi)自然語(yǔ)言”
- 字符串要用引號(hào)包裹。雙引號(hào)、單引號(hào)均可，但必須成對(duì)。數(shù)字用引號(hào)包裹后，也會(huì)轉(zhuǎn)變?yōu)樽址?/li>
-
+可以用來(lái)拼接多個(gè)字符串。
console.log("abc"+"def"),最終輸出為："abcdef" - 字符串length屬性：表示字符串的長(zhǎng)度。
'我愛(ài)javascript'.length,結(jié)果顯示：12。 -
字符串常用方法一覽：
字符串常用方法.png
1.charAt()方法： 得到指定位置的字符。'abcde'.charAt(0)獲取字符串第0位的字符。
2.substring(a,b)方法:
- (1)得到從a開(kāi)始到b結(jié)束(不包括b)的子串。
'abcde'.substring(2,4)結(jié)果為cd。 - (2)substring(a,b)，a可以大于b,數(shù)字順序?qū)⒆詣?dòng)調(diào)整為小數(shù)在前。
3.substr(a，b)方法：
- (1)得到從a開(kāi)始的長(zhǎng)度為b的子串。
'abcdefg'.substr(2,4)結(jié)果為cdef - (2)substr(a，b),a可以是負(fù)數(shù)，表示倒數(shù)位置。
4.slice(a，b)方法：
- (1) slice(a，b)得到從a開(kāi)始到b結(jié)束（不包括b處）的字串。
- (2) slice(a，b)參數(shù)a可以是負(fù)數(shù)。
- (3) slice(a，b)參數(shù)a必須小于參數(shù)b.
** 5.toUpperCase()轉(zhuǎn)為大寫(xiě) **
javascript.toUpperCase(); //JAVASCRIPT
** 6.toLowerCase()轉(zhuǎn)為小寫(xiě) **
‘JAVASCRIPT’.toLowerCase(); //javascript
** 7.indexOf() **
- (1) indexOf(a，b)方法返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置
- (2) 如果要檢索的字符串值沒(méi)有出現(xiàn)，則該返回 -1
（三）Boolean(布爾)類(lèi)型
- 布爾型值只有兩個(gè)：true和false,分別表示真和假。
true、false
（四）undefined
- 一個(gè)沒(méi)有被賦值的變量默認(rèn)值為
undefined,而undefined的類(lèi)型也是undefined。 - undefined是一種類(lèi)型，也是值，這種類(lèi)型只有它自己一個(gè)值。
（五）null
- null表示‘空’，空對(duì)象
- 當(dāng)需要將對(duì)象銷(xiāo)毀、數(shù)組銷(xiāo)毀或則刪除事件監(jiān)聽(tīng)時(shí)，將他們?cè)O(shè)置為null。
（六）數(shù)據(jù)類(lèi)型轉(zhuǎn)換
1.其他->數(shù)字
- 使用Number（）函數(shù)
Number('123'); //123
Number('123.4'); //123.4
Number('2022年'); //NaN
Number('2e3'); //2000
Number(' '); //0
- parseInt（）函數(shù)： 將字符轉(zhuǎn)換為整數(shù)
parseInt(3.14) //3
parseInt('圓周率時(shí)3.14') //NaN
parseInt(true) //NaN
parseInt('3是一個(gè)數(shù)') //3
- parseFloat():將字符串轉(zhuǎn)為浮點(diǎn)數(shù)
···
parseFloat(3.14) //3.14
parseFloat('圓周率時(shí)3.14') //NaN
parseFloat('3是一個(gè)數(shù)') //3
···
2.轉(zhuǎn)換為字符串
- 使用String()函數(shù)
String(123); //'123'
String(123.45) //'123.45'
String(NaN); // 'NaN'
- toString()方法：
var a=6; a.toString( ); // `6`
復(fù)雜數(shù)據(jù)類(lèi)型一覽
數(shù)組、對(duì)象、函數(shù)等
以后再詳細(xì)記錄。
javascript數(shù)據(jù)類(lèi)型.png
四、表達(dá)式與操作符
(一)JS基本表達(dá)式
1.算術(shù)表達(dá)式
算術(shù)運(yùn)算符包括：加
+、 減-、 乘*、 除/、 取余%。
- (1)加號(hào)有“加法”和“連接符”兩個(gè)作用。一般加號(hào)兩邊都是數(shù)字，則為“加法”，否則為連接符。
- (2)取余運(yùn)算也叫“求模運(yùn)算”，用“%”表示。
a%b表示求a除以b的余數(shù)。結(jié)果只獲得余數(shù)。 - (3)默認(rèn)情況下，乘除法優(yōu)先級(jí)高于加減法，使用圓括號(hào)改變運(yùn)算順序。
- (4)隱式類(lèi)型轉(zhuǎn)換：如果參與數(shù)學(xué)運(yùn)算的操作數(shù)不是數(shù)字類(lèi)型，javascript將自動(dòng)將此操作數(shù)轉(zhuǎn)換為數(shù)字類(lèi)型。加號(hào)參考第一條。
- (5)javascript使用IEEE754二進(jìn)制浮點(diǎn)數(shù)算術(shù)標(biāo)準(zhǔn)，導(dǎo)致個(gè)別小數(shù)計(jì)算產(chǎn)生“精度”問(wèn)題。解決辦法：在進(jìn)行小數(shù)運(yùn)算時(shí)，調(diào)用
toFixed()方法，保留指定的小數(shù)位數(shù)。舉例：(0.1+0.23).toFixed(3) - (6)javascript中沒(méi)有提供冪計(jì)算、開(kāi)根號(hào)的運(yùn)算符，需要使用Math對(duì)象相關(guān)方法進(jìn)行計(jì)算。
2.關(guān)系表達(dá)式
關(guān)系運(yùn)算符：大于
>、小于<、大于等于>=、小于等于<=、等于==、不等于!=、全等于===、不全等于!==。
- (1)判斷相等，使用
==。一個(gè)=是賦值符號(hào)，并不判斷相等。 - (2)特殊情況，NaN不自等。使用
isNaN（）函數(shù)來(lái)判斷變量的值是否為NaN。
3.邏輯表達(dá)式
邏輯運(yùn)算符：非
!、與&&、或||。
邏輯運(yùn)算優(yōu)先級(jí)：非->與->或
- (1)
!表示非，也可以稱(chēng)為“置反運(yùn)算”。!是一個(gè)“單目運(yùn)算符”，只需要一個(gè)操作數(shù)。結(jié)果一定是一個(gè)布爾值。 - (2)
&&表示“并且”，稱(chēng)之為“與運(yùn)算”，口訣：
true && true //true
true && fasle //false
false && false //false
false && true //false
- (3)
||表示或則，稱(chēng)為“或運(yùn)算”，口訣：
true && true //true
true && fasle //true
false && false //false
false && true //true
4.賦值表達(dá)式
賦值運(yùn)算符： 賦值
=、快捷賦值+=,-=,*=,/=,%=、自增運(yùn)算++、自減運(yùn)算--
- (1) 一個(gè)等號(hào)
=，將等號(hào)右邊的數(shù)值賦予左邊的變量?？梢赃B續(xù)使用賦值運(yùn)算符。 - (2) 快捷賦值運(yùn)算符表示再原數(shù)值基礎(chǔ)上進(jìn)一步進(jìn)行運(yùn)算。
- (3)
++和--表示再自身基礎(chǔ)上加1或減1。 - (4)
a++先用再加，++a先加再用
