JavaScript基礎知識及寫法

首頁>技術>小白沖沖沖沖2019-11-20 19:33

JavaScript基礎知識及寫法

JavaScript基礎概念

JS的組成：

1.ECMAScript：Js語法

2.DOM：文件物件模型，文件：html文件，操作html文件（操作html文件的工具）

3.BOM：瀏覽器物件模型，操作瀏覽器的工具

JS的三種書寫方式

行內式，內嵌式，外部連結

JavaScript輸入·輸出語句

alert(msg) 瀏覽器彈出警告框

consle.log(msg) 瀏覽器控制檯列印輸出資訊

prompt(info) 瀏覽器彈出輸入框使用者可以輸入資訊

變數的概念

通俗：變數是用於存放資料的容器。我們通過變數名獲取資料，甚至資料可以修改。

變數理解：變化的量，變化的內容，變化的資料

變數儲存資料理解：程式執行過程中的資料儲存在記憶體中，但是記憶體比較大，為了方便管理，所以將記憶體分成一個一個的盒子（變數）來儲存

變數的使用

1.宣告變數 var 變數名；var age；（宣告一個名稱為age 的變數）

2.變數的賦值 var 變數名 = 值; var age = 18; 宣告變數age同時賦值為 18

變數案例

var myname = &#39;旗木卡卡西&#39;; // 字串var address = &#39;火影村&#39;;var age = 30; // 數字var email = &#39;[email protected]&#39;;var gz = 2000;console.log(myname);console.log(address);console.log(age);console.log(email);console.log(‘gz’); // gzconsole.log(gz); // 2000

注意：

變數賦值時，值如果是字串需要新增’’,“”每行程式碼結束，都需要新增;變數在使用時，不能新增引號（定義，宣告變數的時候，沒有引號，使用的時候自然也不能新增引號）案例2：

// 1. 使用者輸入姓名 儲存到一個 myname的變數裡面var myname = prompt(&#39;請輸入您的名字&#39;);// prompt 做的事情：// (1). 彈出輸入框 , 使用者輸入內容:zs// (2). 將使用者輸入內容返回 ，相當於 ：var myname = &#39;zs&#39;;// 2. 輸出這個使用者名稱alert(myname); // zs

變數命名規範

規則

由字母(A-Za-z)、數字(0-9)、下劃線(_)、美元符號( $ )組成，如：usrAge, num01, _name ***

嚴格區分大小寫。var app; 和 var App; 是兩個變數

不能以數字開頭。 18age 是錯誤的

不能是關鍵字、保留字。例如：var、for、while

變數名必須有意義。 MMD BBD nl → age

遵守駝峰命名法。首字母小寫，後面單詞的首字母需要大寫。 myFirstName

推薦翻譯網站：有道愛詞霸

變數案例-交換兩個變數

// js 是程式語言有很強的邏輯性在裡面： 實現這個要求的思路 先怎麼做後怎麼做 // 1. 我們需要一個臨時變數幫我們// 2. 把apple1 給我們的臨時變數 temp // 3. 把apple2 裡面的蘋果給 apple1 // 4. 把臨時變數裡面的值 給 apple2 var temp; // 聲明了一個臨時變數為空var apple1 = &#39;青蘋果&#39;;var apple2 = &#39;紅蘋果&#39;;temp = apple1; // 把右邊給左邊apple1 = apple2;apple2 = temp;console.log(apple1);console.log(apple2);

簡單資料型別JavaScript 中的簡單資料型別及其說明如下：

數字型範圍：JavaScript中數值的最大和最小值

alert(Number.MAX_VALUE); // 1.7976931348623157e+308 （10的正308次方）

alert(Number.MIN_VALUE); // 5e-324 5e-324 （10的負324次方）

數字型三個特殊值

alert(Infinity); // Infinityalert(-Infinity); // -Infinityalert(NaN); // NaN ***//課堂程式碼：// 5. 無窮大console.log(Number.MAX_VALUE * 2); // Infinity 無窮大 // 6. 無窮小console.log(-Number.MAX_VALUE * 2); // -Infinity 無窮大// 7. 非數字console.log(&#39;pink老師&#39; - 100); // NaN：字串是無法與數字進行運算的，所以結果是一個非數字

Infinity ，代表無窮大，大於任何數值-Infinity ，代表無窮小，小於任何數值NaN ，Not a number，代表一個非數值

isNaN用來判斷一個變數是否為非數字的型別，返回 true 或者 false

var usrAge = 21;var isOk = isNaN(userAge);console.log(isNum); // false ，21 不是一個非數字var usrName = &#34;andy&#34;;console.log(isNaN(userName)); // true ，&#34;andy&#34;是一個非數字

字串型 String字串型可以是引號中的任意文字，其語法為雙引號 “” 和單引號’’

var strMsg = &#34;我愛北京天安門~&#34;; // 使用雙引號表示字串var strMsg2 = &#39;我愛吃豬蹄~&#39;; // 使用單引號表示字串// 常見錯誤var strMsg3 = 我愛大肘子; // 報錯，沒使用引號，會被認為是js程式碼，但js沒有這些語法

字串引號巢狀JS 可以用單引號巢狀雙引號，或者用雙引號巢狀單引號 (外雙內單，外單內雙)

var strMsg = &#39;我是&#34;高帥富&#34;程式猿&#39;; // 可以用&#39;&#39;包含&#34;&#34;

var strMsg2 = &#34;我是&#39;高帥富&#39;程式猿&#34;; // 也可以用&#34;&#34; 包含&#39;&#39;

// 常見錯誤

var badQuotes = &#39;What on earth?&#34;; // 報錯，不能 單雙引號搭配

字串轉義符

類似HTML裡面的特殊字元，字串中也有特殊字元，我們稱之為轉義符。

轉義符都是 \\ 開頭的，常用的轉義符及其說明如下：

字串長度

字串是由若干字元組成的，這些字元的數量就是字串的長度通過字串的 length 屬性可以獲取整個字串的長度

var strMsg = &#34;我是帥氣多金的程式猿！&#34;;

 alert(strMsg.length); // 顯示 11

字串拼接

多個字串之間可以使用 + 進行拼接，其拼接方式為字串 + 任何型別 = 拼接之後的新字串拼接前會把與字串相加的任何型別轉成字串，再拼接成一個新的字串

//1.1 字串 &#34;相加&#34;alert(&#39;hello&#39; + &#39; &#39; + &#39;world&#39;); // hello world//1.2 數值字串 &#34;相加&#34;alert(&#39;100&#39; + &#39;100&#39;); // 100100//1.3 數值字串 + 數值alert(&#39;11&#39; + 12); // 1112 //以上的字串拼接都沒有意義，一般我們字串會與變數進行拼接