第三階段js開始试溯。

js第一天。

JavaScript 基礎(chǔ)課程

在前端就業(yè)js基礎(chǔ)階段課程V8.0（pink老師版）

課程安排：

js基礎(chǔ) 5+1 基本語法? 變量循環(huán)對象函數(shù)等

web apis 6+1 操作dom bom 控制交互效果

js高級 4 新增語法 高級技巧

js基礎(chǔ)第一天

js介紹

js書寫在sccript中，有三個書寫位置

js的結(jié)束符分號痘昌，可以寫可以不寫

1.輸出語法：1.document.write('網(wǎng)頁中輸出的內(nèi)容')

document.write('

輸出h1標(biāo)題

')

? ? ? 2.alert('網(wǎng)頁警示輸出內(nèi)容')?

? 3. console.log('控制臺輸出語句')

2.輸入語法 ： 1.prompt('網(wǎng)頁彈出輸入框')

prompt('請輸入')

document.write('js我來了')

console.log('控制臺輸出')

alert('頁面彈出')

按照html文檔流順序執(zhí)行js代碼 alert（）和prompt（）會跳過頁面渲染先被執(zhí)行尘惧。

字面量：是在計算機(jī)中描述的事/物

變量

變量含義：變量就是一個裝物體的盒子，是存儲數(shù)據(jù)的容器笙瑟。

聲明變量：也稱創(chuàng)建變量

語法：

let 變量名

變量賦值：=

let age

age = 18

alert (age)

console.log(age)

變量的初始化：聲明時賦值

let age = 18

小案例

let num = 20

let uname = '張三'

console.log(num)

console.log(uname)

變量的更新與聲明多個變量

let age = 18

age = 19

console.log (age)

//不能再次聲明 let age

let name = '張三', sex = '女'

//聲明建議分開

console.log (name,sex)

小案例1

//用戶輸入楼镐，數(shù)據(jù)處理，打印輸出

let uname = prompt('請輸入名字')

document.write(uname)

小案例2

//nu1 存10 nu2 存20 讓兩者交換數(shù)字

let nu1 = 10

let nu2 = 20

let temp = nu1

nu1 = nu2

nu2 = temp

document.write('nu1為' + nu1, 'nu2為' + nu2)

變量的本質(zhì)

是在計算機(jī)內(nèi)存ram中申請的一塊用于存放數(shù)據(jù)的小空間

變量的命名規(guī)范和規(guī)則

小練習(xí)

let uname = prompt('請輸入你的性名')

let age = prompt('請輸入你的年齡')

let gender = prompt('請輸入你的性別')

document.write ('你的性名是'+uname往枷，'你的年齡是'+age,'你的性別是'+gender)

var和let的區(qū)別

在舊版本的js中框产，變量用var聲明

數(shù)組Array

一個變量中存多個不同類型的數(shù)據(jù)。

專業(yè)名詞：元素错洁，下標(biāo)秉宿，長度

語法聲明：

let 數(shù)組名 = [數(shù)據(jù)1,數(shù)據(jù)2,···,數(shù)據(jù)n]

let arr = [10,20,30]

let arr1=['劉德華','張學(xué)友','mazw']

console.log(arr1)

數(shù)組是有序的，數(shù)組中的每一個元素都是有一個序號從0開始的屯碴，編號也被稱為索引描睦，下標(biāo)。

數(shù)組可以存儲任何數(shù)據(jù)類型的數(shù)據(jù)窿锉。

//打印數(shù)組中的某個元素酌摇，序號從0開始的

let arr1=['劉德華','張學(xué)友','mazw']

console.log(arr1[0])

//打印出來的是劉德華

小案例(逗號的后面加個空格)

//定義一個數(shù)組膝舅，存放星期一到星期天，輸出星期天

let arr = ['星球一', '星球二', '星球三', '星球四', '星球五', '星期六', '星期天']

console.log(arr[6])

//打印數(shù)組長度

console.log(arr.length)

數(shù)組的長度=下標(biāo)+1窑多，下標(biāo)是從0開始的

常量

用const聲明的變量 稱為’常量‘

//常量聲明必須賦值（初始化）仍稀，并且不允許更改

const G = 8.9

console.log(G)

//常量不能再次賦值，否則會報錯

數(shù)據(jù)類型

基本數(shù)據(jù)類型

引用數(shù)據(jù)類型（復(fù)雜數(shù)據(jù)類型）

object 對象

下午

接昨天晚上

數(shù)據(jù)類型

1.基本數(shù)據(jù)類型

number 數(shù)字型

string 字符串型

boolean 布爾型

undefined 未定義型

null 空類型

2.引用數(shù)據(jù)類型（復(fù)雜數(shù)據(jù)類型）

object 對象

number 數(shù)字型

js是弱數(shù)據(jù)類型語言埂息，只要是數(shù)字技潘，可以是整數(shù)，小數(shù)千康，正數(shù)享幽，負(fù)數(shù)；只有你賦值之后才知道是什么數(shù)據(jù)類型拾弃。

let age = 18

let ageName = 18.88

let ageNameUser = -20

//以下是字符串型

let nameUser = 'pink'

進(jìn)行計算

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

先乘除后加減

% 為取模（取余數(shù)）在開發(fā)中經(jīng)常被用作是否被整除

console.log (3 % 5)

//結(jié)果為3 前邊數(shù)比后邊小取余結(jié)果就是前邊的數(shù)

小案例

//輸入園的半徑值桩，算出面積并打印到頁面

let ver = prompt('請輸入圓的半徑')

let mianji = ver * ver * 3.14

document.write('圓的面積是' + mianji)

//NaN 代表計算錯誤 Not a Number

// 是粘性的 任何和NaN的操作 都是NaN

console.log(NaN === NaN)

//結(jié)果為false

console.log('mazw' - 2)

//輸出的是NaN

string字符串型

只要使用單引號，雙引號豪椿，或反引號 包裹的都叫字符串

只要是加引號就都是字符串型

引號的嵌套：外單內(nèi)雙/外雙內(nèi)單

let srt = 'mazw'

let str1 = "mazw"

let str2 = `中文`

//以下打印的是字符串

let str3 = `123577888`

//空字符串

let str3 = ``

字符串的拼接：

+ 號 數(shù)字相加奔坟，字符相連

let uname = prompt('請輸入你的性名')

let age = prompt('請輸入你的年齡')

let gender = prompt('請輸入你的性別')

document.write('你的性名是' + uname + '你的年齡是' + age + '你的性別是' + gender)

模板字符串

通常使用在 字符串和變量的拼接

必須用反引號

里面用${}

let age1 = 18

document.write(`我今年${age1}`)

小案例

記得用反引號包含

let name = prompt(`你是誰`)

let age2 = prompt(`多大了`)

let sex = prompt(`男的女的`)

document.write(`你是${name},今年{age2},性別${sex}`)

Boolean類型

兩個固定值，true 和 false

undefined類型

只聲明變量不賦值 打印之后就會出現(xiàn) undefined（未定義類型）

使用場景：等待傳送過來的數(shù)據(jù)的時候

null類型

空類型搭盾，把null作為尚未創(chuàng)建的對象

undefined和null區(qū)別

undefined是未定義咳秉，沒有值傳過來

null是定義好了，往里邊放入一個空內(nèi)容（確定里面是對象鸯隅，但是對象還沒有準(zhǔn)備好澜建，可以先放入一個null）

console.log(null + 1)

//結(jié)果為1

console.log(undefined + 1)

//結(jié)果為NaN

數(shù)據(jù)類型的檢測

通過typeof關(guān)鍵字檢測數(shù)據(jù)類型

? ? ? ? let num = 10

? ? ? ? console.log(typeof num)

? ? ? ? let st = 'mzaw'

? ? ? ? console.log(typeof st)

? ? ? ? let fla = true

? ? ? ? console.log(typeof fla)

? ? ? ? let un

? ? ? ? console.log(typeof un)

? ? ? ? let obj = null

? ? ? ? console.log(typeof obj)

輸出結(jié)果：

類型轉(zhuǎn)換

對 表單中的 輸入框 單選框，復(fù)選框蝌以，與 prompt的輸入 都是字符串類型的炕舵，無法進(jìn)行數(shù)字運(yùn)算

轉(zhuǎn)換方式:隱式轉(zhuǎn)換，顯式轉(zhuǎn)換

隱式轉(zhuǎn)換

在運(yùn)算過程中系統(tǒng)自己轉(zhuǎn)換

console.log(+'123') //+會將字符串轉(zhuǎn)換為數(shù)字型

con

顯式轉(zhuǎn)換

隱式轉(zhuǎn)換規(guī)律不明確跟畅，在轉(zhuǎn)換時幕侠，嚴(yán)格區(qū)分大小寫

Number(數(shù)據(jù))

let gongZi = prompt('請輸入工資')

let gongZi1 = +('請輸入工資')//+號也可以轉(zhuǎn)換成數(shù)字類型

console.log(Number(gongZi) + 9);

NaN也是number類型的數(shù)據(jù)，含義是非數(shù)字

parseInt(數(shù)據(jù))

只保留整數(shù)碍彭，將其中的其他單位或文字去除

parseFloat(數(shù)據(jù))

可以保留小數(shù)，將其中的其他單位或文字去除

console.log(parseInt('12px') + 2);//14

console.log(parseInt('12.999px') + 2);//14

console.log(parseInt('abd13.999px') + 2);//NaN

//對于px會自動掠過

console.log(parseFloat('13px') + 2);//15

console.log(parseFloat('13.999px') + 2);//15.999

console.log(parseFloat('abd13.999px') + 2);//NaN

小案例

//輸入兩個數(shù)悼潭，計算兩者和庇忌，打印到頁面中

let num1 = +prompt('請輸入第一個數(shù)')

let num2 = +prompt('請輸入第二個數(shù)')

document.write(num1 + num2)

第一天補(bǔ)缺

js是一個編程語言

ECMAScript 基礎(chǔ)規(guī)定了js的基礎(chǔ)語法? 和? web APIs DOM操作文檔 BOM操作瀏覽器

onclick，事件點(diǎn)擊

alert（）

變量是容器舰褪，容器用來存儲數(shù)據(jù)

先聲明再使用

一次聲明多個變量

let age = 22 , uname = '張三'

let age = 22

let uname = '李四'

字面量皆疹。看到就知道是什么類型

對于document.write()輸出占拍，可以輸出html標(biāo)簽

對于alert()和conlose.log()是不可以輸出html的標(biāo)簽

命名規(guī)則：字母數(shù)字下劃線美元$,數(shù)字和關(guān)鍵字不可以開頭

數(shù)組的定義與存儲

數(shù)字類型

取模操作

js中存在精度丟失問題略就，盡量避免小數(shù)運(yùn)算

NaN是計算是計算錯誤捎迫，在進(jìn)行減 乘 除 % 時會出現(xiàn)。

+ 數(shù)字相加表牢，字符相連

數(shù)據(jù)類型undefined窄绒，聲明變量沒有賦值就是undefined，運(yùn)用場景：未輸入賬號崔兴。密碼就點(diǎn)擊登錄

null代表賦值了彰导，但是內(nèi)容為空 需要手動賦值，一般用作敲茄，清空變量位谋，把內(nèi)存中的變量進(jìn)行銷毀

let age = null ，表示堰燎，還沒開始就已經(jīng)結(jié)束

typeof null 結(jié)果是 object

- * / 都會進(jìn)行隱式轉(zhuǎn)換 會將結(jié)果轉(zhuǎn)化為符號前邊的類型