首頁 > 曲藝

一步步跟我學前端14——JavaScript來了

作者:由 冰冰愛程式設計 發表于 曲藝日期:2021-12-18

什麼是js

JavaScript

又是一個新知識點,我們一起來認識一下新朋友吧。這個新朋友有點點難打交道哦,我們一起加油呀!

1、瞭解什麼是JavaScript ?

JavaScript是一種基於物件和事件驅動的客戶端指令碼語言,最初的設計是為了檢驗HTML表單輸入的正確性,起源於Netscape公司的LiveScript語言。

2、瞭解JavaScript的發展歷史

能夠處理複雜的計算和互動

web的重要組成部分

從一個簡單的輸入驗證器到一個強大的程式語言

簡單又複雜

3、瞭解JavaScript的組成部分

一步步跟我學前端14——JavaScript來了

4、在HTML中使用JavaScript

可以在head或body中使用script標籤嵌入JavaScript指令碼。

語法

//單行註釋

/**/多行註釋

語句結束使用

分號

,如果省略,則由解析器確定語句的結尾。

最好我們還是養成一個良好的習慣

ECMAScript中的一切(變數、函式名和運算子)都區分大小寫。

1、什麼是

識別符號

變數、函式、屬性的名字,或者函式的引數。

2、識別符號的命名規則:

(1)、由字母、數字、下劃線(_)或美元符號($)組成

(2)、

不能以數字開頭

(3)、不能使用關鍵字、保留字等作為識別符號。

ECMAScript的變數是鬆散型別

鬆散型別︰可以用來儲存任何型別的資料

換句話說,每個

變數

僅僅是一個用於

儲存值的佔位符

而已。

1、變數的宣告要使用

var運算子

語法:var 變數名

2、變數賦值:

宣告的同時賦值:var變數名=值

先聲明後賦值:變數名=值

—次宣告多個變數,用逗號隔開,如:

var name_1;name_1 = “ZhengQian”;var id, sex, age = 15,name = “hurry”;console。log(age); //在控制檯中列印

省略var宣告的變數是全域性變數

但我們最好不要去省略var來定義全域性變數

JavaScript的資料型別

一步步跟我學前端14——JavaScript來了

如何知道是什麼型別的呢

typeof

一步步跟我學前端14——JavaScript來了

console。log(typeof(name)); //在控制檯中列印

undefined型別只有一個值,即

特殊的undefined

說明∶ 即

沒有定義

一般而言,不存在需要顯式地把一個變數設定為undefined值的情況。

null

值表示一個

空物件指標

如果定義的變數準備在將來用於儲存物件,那麼最好將改變數初始化為null而不是其他值。

console。log(undefined==null); //在控制檯中列印true

說明:undefined值是派生自null值的,所以返回結果是true。

1、掌握Number

NUmber表示整數和浮點數

NaN:即非數值(Not a Number)是一個特殊的數值

NaN也是一個數值

console。log(typeof(18-“cbd”));//返回numberconsole。log(isNaN(“16”));//返回false

任何涉及NaN的操作(例如NaN/10)都會返回NaN。NaN與任何值都不相等,包括NaN本身。

2、掌握isNaN()

功能∶檢測是否是“非數值”返回值:boolean

n可以是任何型別

對接受的數值,這個函式會

先嚐試著去轉換為數值

,再檢測是否為非數值。

3、掌握數值轉換

Number()

parseInt()

parseFloat()

注意大小寫

Number()可以用於任何資料型別

parseInt()和parseFloat()則專門用於把字串轉換成數值。

但這些字串

必須得以數值開頭

console。log(Number(“323”));//323console。log(Number(“323fsfd”));// NaNconsole。log(parseInt(“323fsfd”));// 323console。log(parseInt(“were323fsfd”));// NaNconsole。log(parseInt(“0xf”));// 15console。log(parseInt(“0xf”,16));// 15

當轉換不了時,則NaN

parseInt():會忽略字串前面的空格,直至找到第一個非空格字元。

說明∶

1、parseInt():轉換空字串返回NaN。

2、parseInt()這個函式提供第二個引數:轉換時使用的基數

(即多少進位制)

parseFloat

:從第一個字元開始解析每個字元,直至遇見一個無效的

浮點數字符為止。

說明∶

除了第一個小數點有效外,parseFloat()與parseInt()的第二個

區別在於它始終都會忽略前導的零。

console。log(parseInt(“12。35px”));// 12console。log(parseFloat(“12。35px”));//12。35console。log(parseFloat(“12。35。43px”));//12。35console。log(parseFloat(“0。1235px”));//0。1235

String型別用於表示由零或多個16位Unicode字元組成的字元序列,即字串。字串可以由雙引號(”)或單引號(’)表示。

語法:str。toString()

功能︰將str轉換為字串

返回值:str的一個副本

引數:str是要轉換的內容,可以是數值、布林值、物件和字串。

說明:在不知道要轉換的值是不是null或undefined的情況下,還可以使用

String()函式

,它

能夠將任何型別的值轉換為字串

var ids=78965;var idstr=ids。toString();console。log (typeof idstr);var isStudent = true; //則此時isStudent為Boolean型console。log(typeof isStudent);console。log(isStudent。toString());//則此時轉換為‘true’字串//一定要注意函式方法的大小寫toString

Boolean()

1、除

0

之外的所有數字,轉換為布林型都為true

2、除“ ”之外的所有字元,轉換為布林型都為true

3、

null

undefined

轉換為布林型為false

空格轉換為boolean都為true

那這些變數型別轉來轉去有什麼意義?

一般都會說為後面的做鋪墊,但不說為什麼?

其實型別轉換可以為if(){}等語句做判斷等

js算數運算子

1、掌握什麼是表示式

將同類型的資料(如常量、變數、函式等),用運算子號按一定的規則連線起來的、有意義的式子稱為表示式。

2、掌握javascript運算子的分類

算數運算子

邏輯運算子

武值運算子

比較運算子

三元運算子

3、掌握算數運算子

+:加

-:減

*:乘

/ :除

%∶取餘

1、遞增

++a與a++都是對a進行遞增的操作

區別:

++a先返回遞增之後的a的值

a++先返回a的原值,再返回遞增之後的值

2、遞減同理

var num1 = 10, num2 = “5”; console。log(num1 - num2); //number NaN 隱式型別轉換var num1=10, num2=5, num3=num1++-num2;//++num1 num1=num1+1console。log(num1) ;// 11 //11console。log(num3) ;// 16 //5

賦值運算子:

= += -= *= /= %=

注意:任何字串+任何值 都會連線,此處“+”號就是連線符

>、<、>=、<=、==、===、!=、!====∶相等,只比較值是否相等===:相等,比較值的同時比較資料型別是否相等!=∶不相等,比較值是否不相等!==∶不相等,比較值的同時比較資料型別是否不相等返回值:boolean型var x=10, y=“10”, m=15, //z=x==y;//值是否相等 z=x===y;//全等 n=x!==y;console。log(n);

三元運算子

語法:

條件?執行程式碼1:執行程式碼2

說明∶

可代替簡單的if語句,

如果條件成立,執行程式碼1,否則執行程式碼2

邏輯運算子&& || !與或非

var num1=10, num2=20, num3=30, str=“welcome” , bool=true, n=null, m ;console。log(numl

&&與(只要有一個條件不成立,返回false )

說明︰在

有一個運算元不是布林值

的情況,邏輯與操作就不一定返回值,此時它遵循下列規則∶

1、如果第一個運算元隱式型別轉換後為true,則返回第二個運算元。

2、如果第一個運算元隱式型別轉換後為false,則返回第一個運算元。

Ⅱ或

(只要有一個條件成立,返回true )

說明∶在有一個運算元不是布林值的情況,邏輯或操作就不一定返回值,此時它遵循下列規則∶

1、如果第一個運算元隱式型別轉換後為true,則返回第一個運算元。

2、如果第一個運算元隱式型別轉換後為false,則返回第二個運算元。

3、如果兩個運算元是null,則返回null

4、如果兩個運算元是NaN,則返回NaN

5、如果兩個運算元是undefined,則返回undefined

!非

說明∶

1、無論運算元是什麼資料型別,邏輯非都會返回一個布林值

2、!!同時使用兩個邏輯非運算子時:

第一個邏輯非操作會基於無論什麼運算元返回一個布林值

第二個邏輯非則對該布林值求反

console。log(!!“”);//falseconsole。log(!!“blue”);//true

NEXT:

JavaScript的分支語句!