一、初識JavaScript

1. 什么是JavaScript？

JavaScript (簡稱 JS)

• 是世界上最流行的編程語言之一
• 是一個腳本語言, 通過解釋器運行
• 主要在客戶端(瀏覽器)上運行, 現(xiàn)在也可以基于 node.js 在服務(wù)器端運行

JavaScript 最初只是為了完成簡單的表單驗證(驗證數(shù)據(jù)合法性)，結(jié)果后來不小心就火了。當前 JavaScript 已經(jīng)成為了一個通用的編程語言。

?? JavaScript能做的事情：

• 網(wǎng)頁開發(fā)(更復(fù)雜的特效和用戶交互)
• 網(wǎng)頁游戲開發(fā)
• 服務(wù)器開發(fā)(node.js)
• 桌面程序開發(fā)(Electron, VSCode 就是這么來的)
• 手機 app 開發(fā)

2. JavaScript 和 HTML 和 CSS 之間的關(guān)系

• HTML: 網(wǎng)頁的結(jié)構(gòu)(骨)
• CSS: 網(wǎng)頁的表現(xiàn)(皮)
• JavaScript: 網(wǎng)頁的行為(魂)

3. JavaScript的運行過程

JS通常是運行在瀏覽器上的。

• 編寫的代碼是保存在文件中的, 也就是存儲在硬盤(外存上).
• 雙擊 .html 文件瀏覽器(應(yīng)用程序)就會讀取文件, 把文件內(nèi)容加載到內(nèi)存中(數(shù)據(jù)流向: 硬盤 => 內(nèi)存)
• 瀏覽器會解析用戶編寫的代碼, 把代碼翻譯成二進制的, 能讓計算機識別的指令(解釋器的工作)
• 得到的二進制指令會被 CPU 加載并執(zhí)行(數(shù)據(jù)流向: 內(nèi)存 => CPU)

?? 瀏覽器分成渲染引擎 + JS 引擎

• 渲染引擎: 解析 html + CSS, 俗稱 “內(nèi)核”
• JS 引擎: 也就是 JS 解釋器. 典型的就是 Chrome 中內(nèi)置的 V8

JS 引擎逐行讀取 JS 代碼內(nèi)容, 然后解析成二進制指令, 再執(zhí)行。

4. JavaScript的組成

• ECMAScript(簡稱 ES): JavaScript 語法
• DOM: 頁面文檔對象模型, 對頁面中的元素進行操作
• BOM: 瀏覽器對象模型, 對瀏覽器窗口進行操作

光有 JS 語法, 只能寫一些基礎(chǔ)的邏輯流程，但是要想完成更復(fù)雜的任務(wù), 完成和瀏覽器以及頁面的交互, 那么久需要 DOM API 和 BOM API

這主要指在瀏覽器端運行的JS，如果是運行在服務(wù)端的JS, 則需要使用 node.js 的 API，就不太需要關(guān)注 DOM 和 BOM

?? 重要概念: ECMAScript

這是一套 “標準”, 無論是啥樣的 JS 引擎都要遵守這個標準來實現(xiàn)。

啥叫標準? 車同軌, 書同文. 秦始皇最大的貢獻之一, 就是制定了一套標準，三流公司做產(chǎn)品, 一流公司做標準。

二、JavaScript的書寫形式

?? 行內(nèi)式

直接嵌入到 html 元素內(nèi)部

<input type="button" value="這是一個按鈕" onclick="alert('哈哈哈')">

當我們按下按鈕后，會有如下效果：

?? 內(nèi)嵌式

寫到 script 標簽中

<script>
	alert("haha");
</script>

?? 外部式

<script src="./js01.js"></script>

?? 第一個JS程序

注釋：

• 單行注釋 // [建議使用]
• 多行注釋 /* */

使用 ctrl + / 切換注釋，多行注釋不能嵌套。形如這種代碼就會報錯：

/*
/*
我是多行注釋
我是多行注釋
我是多行注釋
*/
*/

三、變量

1. 輸入輸出

?? 輸入：prompt

彈出一個輸入框，提示輸入自己的姓名。

<script>
    prompt("請輸入您的姓名: ");    
</script>

?? 輸出: alert

<script>
    alert("hello 你好");
</script>

?? 輸出: console.log：向控制臺打印一個日志，供程序員看。

<script>
    console.log("hello 你好");
</script>

注意：這樣的輸出一般不是給普通用戶看的, 而是程序員來看的

重要概念: 日志

日志是程序員調(diào)試程序的重要手段

去醫(yī)院看病, 醫(yī)生會讓患者做各種檢查, 血常規(guī), 尿常規(guī), B超, CT等… 此時得到一堆檢測結(jié)果. 這些結(jié)果普通人看不懂, 但是醫(yī)生能看懂, 并且醫(yī)生要通過這些信息來診斷病情，這些檢測結(jié)果就是醫(yī)生的 “日志”

PS: 相比于醫(yī)生來說, 程序猿多一個終極大招, “重啟下試試”。

重要概念: .

console 是一個 js 中的 “對象”，. 表示取對象中的某個屬性或者方法. 可以直觀理解成 “的”。console.log 就可以理解成: 使用 “控制臺” 對象 “的” log 方法。

2. 變量的使用

?? 創(chuàng)建變量(變量定義/變量聲明/變量初始化)

<script>
    var name = "chenjiale";
    console.log(name)
    let age = "23"
</script>

這里定義變量時我們不需要指定數(shù)據(jù)類型，使用var或者let即可，那我們該如何選擇呢？

let比var出現(xiàn)的晚，意味著避免了var這塊定義變量的時候的一些缺陷，如果使用let定義變量，此時變量的生命周期、作用域基本和Java類似。

JS對于數(shù)字類型只有一種類型：數(shù)值類型。

?? 強類型變量和弱類型變量

強類型變量意味著不同類型的變量之間進行賦值的時候，需要一定的手段（強制類型轉(zhuǎn)換）。弱類型變量在不同類型變量之間進行賦值的時候，可以直接賦值。

<script>
     a = 1
     console.log(a)
     b = 'b'
     b = a;
     console.log(b);
</script>

這里我們可以看到JS中的變量是弱類型變量。

?? 動態(tài)類型變量和靜態(tài)類型變量

動態(tài)類型變量意味著代碼在執(zhí)行過程中，變量的類型可以隨時發(fā)生變化。靜態(tài)類型變量意味著變量定義的時候是什么類型，在運行過程中就是什么類型。

<script>
    a = 1
    console.log(typeof(a))
    b = 'b'
    a = b
    console.log(typeof(a));
</script>

隨著程序運行, 變量的類型發(fā)生了改變，說明該變量類型是動態(tài)類型變量。

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

JS 中內(nèi)置的幾種類型

• number: 數(shù)字，不區(qū)分整數(shù)和小數(shù)
• boolean: true 真，false 假
• string: 字符串類型
• undefined: 只有唯一的值 undefined 表示未定義的值.
• null: 只有唯一的值 null，表示空值

?? number 數(shù)字類型

JS 中不區(qū)分整數(shù)和浮點數(shù), 統(tǒng)一都使用 “數(shù)字類型” 來表示。

<script>
    let a = 10;
    console.log(typeof(a))
    a = a / 3
    console.log(a)
    console.log(typeof(a))
</script>

這里我們可以看到，整數(shù)和小數(shù)在JS中都用number類型表示。

數(shù)字進制表示

計算機中都是使用二進制來表示數(shù)據(jù), 而人平時都是使用十進制，因為二進制在使用過程中不太方便(01太多會看花眼)，所以在日常使用二進制數(shù)字時往往使用 八進制 和 十六進制 來表示二進制數(shù)字.

注意:

• 一個八進制數(shù)字對應(yīng)三個二進制數(shù)字
• 一個十六進制數(shù)字對應(yīng)四個二進制數(shù)字. (兩個十六進制數(shù)字就是一個字節(jié))
• 各種進制之間的轉(zhuǎn)換, 不需要手工計算, 直接使用計算器即可

特殊的數(shù)字值

• Infinity: 無窮大, 大于任何數(shù)字. 表示數(shù)字已經(jīng)超過了 JS 能表示的范圍.
• -Infinity: 負無窮大, 小于任何數(shù)字. 表示數(shù)字已經(jīng)超過了 JS 能表示的范圍.
• NaN: 表示當前的結(jié)果不是一個數(shù)字.

<script>
    let a = 10;
    console.log(a/0)
    console.log(-a/0)
    console.log('hehe' - 10)
</script>

注意：

1. 負無窮大 和 無窮小 不是一回事. 無窮小指無限趨近與 0, 值為 1 / Infinity。
2. ‘hehe’ + 10 得到的不是 NaN, 而是 ‘hehe10’, 會把數(shù)字隱式轉(zhuǎn)成字符串, 再進行字符串拼接。
3. 可以使用 isNaN 函數(shù)判定是不是一個非數(shù)字。

console.log(isNaN(10)); // false
console.log(isNaN('hehe' - 10)); // true

?? string 字符串類型

基本規(guī)則：字符串字面值需要使用引號引起來, 單引號雙引號均可

<script>
    let a = '哈哈哈'
    a = "JS"
    a = "哈哈哈'JS'"
    a  = '哈哈哈"JS"'
    alert(a)
</script>

如果字符串中本來已經(jīng)包含引號咋辦?

var msg = "My name is "zhangsan""; // 出錯
var msg = "My name is \"zhangsan\""; // 正確, 使用轉(zhuǎn)義字符. \" 來表示字符串內(nèi)部的引
號.
var msg = "My name is 'zhangsan'"; // 正確, 搭配使用單雙引號
var msg = 'My name is "zhangsan"'; // 正確, 搭配使用單雙引號

轉(zhuǎn)義字符

有些字符不方便直接輸入, 于是要通過一些特殊方式來表示.

• \n
• \\
• \'
• \"
• \t

求長度： 使用 String 的 length 屬性即可

<script>
    let a = "哈哈哈"
    alert(a.length)
</script>

字符串拼接：使用 + 進行拼接

<script>
    a = "程序人"
    console.log("Hello" + a)
    console.log("10" + 10) // 這里和Java中類似
</script>

?? boolean 布爾類型

boolean類型表示 “真” 和 “假”，boolean 原本是數(shù)學中的概念 (布爾代數(shù))，在計算機中 boolean 意義重大，往往要搭配條件/循環(huán)完成邏輯判斷。

JS中的boolean類型和C語言中的bool類型類似，參與運算時，true表示1，false表示0。

<script>
    let a = false
    console.log(typeof(a))
    a = a + 1
    console.log("a的值等于" + a + ",a的類型" + typeof(a))
</script>

?? undefined 未定義數(shù)據(jù)類型

如果一個變量沒有被初始化過，結(jié)果就是 undefined，是 undefined 類型。

<script>
   let a;
   console.log(a)
   console.log(a + "20")
   console.log(a + 1)
   console.log(a + true)
</script>

?? null 空值類型

<script>
    let a;
    let b = null;
    console.log(a + 10);// 運行結(jié)果NaN
    console.log(b + 10);// 運行結(jié)果是10
</script>

四、運算符

JavaScript 中的運算符和 Java 用法基本相同. 此處不做詳細介紹了。

?? 算術(shù)運算符

• +
• -
• *
• /

?? 賦值運算符 & 復(fù)合賦值運算符

• =
• +=
• -=
• *=
• /=
• %=

?? 自增自減運算符

• ++: 自增1
• --: 自減1

?? 比較運算符

• <
• <=
• >=
• == 比較相等(會進行隱式類型轉(zhuǎn)換)
• !=
• === 比較相等(不會進行隱式類型轉(zhuǎn)換)
• !==

<script>
   let a = 10;
   let b = "10";
   alert(a == b)
</script>

<script>
   let a = 10;
   let b = "10";
   alert(a === b)
</script>

?? 邏輯運算符

用于計算多個 boolean 表達式的值.

• && 與: 一假則假
• || 或: 一真則真
• ! 非

?? 移位運算

• << 左移
• >> 有符號右移(算術(shù)右移)
• >>> 無符號右移(邏輯右移)

五、分支和循環(huán)語句

1. 分支語句

?? if語句

// 形式1
if (條件) {
	語句
}

// 形式2
if (條件) {
	語句1
} else {
	語句2
}

// 形式3
if (條件1) {
	語句1
} else if (條件2) {
	語句2
} else if .... {
	語句...
} else {
	語句N
}

案例：

<script>
    let num = prompt("請輸入數(shù)字")
    if(num % 2 == 0) {
        alert("這個數(shù)字是偶數(shù)")
    } else if(num % 2 == 1) {
        alert("這個數(shù)字是奇數(shù)")
    } else {
        alert("非法輸入")
    }
</script>

?? 三元表達式

是 if else 的簡化寫法，

條件 ? 表達式1 : 表達式2

條件為真, 返回表達式1 的值. 條件為假, 返回表達式2 的值。注意, 三元表達式的優(yōu)先級是比較低的

alert(1 === "1" ? true : false)

?? switch語句

用戶輸入一個整數(shù), 提示今天是星期幾

let day = prompt("請輸入今天是星期幾：")
day = parseInt(day)
switch(day) {
    case 1:
        alert("今天是星期一")
        break
    case 2:
        alert("今天是星期二")
        break
    case 3:
        alert("今天是星期三")
        break
    case 4:
        alert("今天是星期四")
        break
    case 5:
        alert("今天是星期五")
        break
    case 6:
        alert("今天是星期六")
        break
    case 7:
        alert("今天是星期天")
        break
    default:
        alert("非法輸入")
}

2. 循環(huán)語句

?? for循環(huán)語句

let result = 0;
for(let i = 100; i <= 200; i++) {
    if(i % 3 == 0) {
        result = i;
        break;
    }
}
alert("100~200之間第一個3的倍數(shù)是" + result)

?? while循環(huán)語句

while (條件) {
	循環(huán)體;
}

執(zhí)行過程:

• 先執(zhí)行條件語句
• 條件為 true, 執(zhí)行循環(huán)體代碼.
• 條件為 false, 直接結(jié)束循環(huán)

案例：

var num = 1;
while (num <= 10) {
    console.log(num);
    num++;
}

六、數(shù)組

?? 創(chuàng)建數(shù)組

使用 new 關(guān)鍵字創(chuàng)建

// Array 的 A 要大寫
var arr = new Array();

使用字面量方式創(chuàng)建 [常用]

var arr = [];
var arr2 = [1, 2, 'haha', false]; // 數(shù)組中保存的內(nèi)容稱為 "元素"

案例：

let array = new Array();
let array1 = [1, 2, 3, "4"]
console.log(typeof(array1))
console.log(array1)
console.log(array1[2])

注意: JS 的數(shù)組不要求元素是相同類型，這一點和 C, C++, Java 等靜態(tài)類型的語言差別很大. 但是 Python, PHP 等動態(tài)類型語言也是如此。

let array1 = [1, 2, 3, "4"]
// 這種寫法在JS中并不會拋異常, 如果下標超出范圍讀取元素, 則結(jié)果為 undefined
console.log(array1[-10])
array1 = "程序人"
console.log(typeof(array1))
console.log(array1)

注意: 不要給數(shù)組名直接賦值, 此時數(shù)組中的所有元素都沒了，相當于本來 arr 是一個數(shù)組, 重新賦值后變成字符串了。

?? 新增數(shù)組元素

1. 通過修改 length 新增，相當于在末尾新增元素. 新增的元素默認值為 undefined

let array = [1, 2, 3, 4]
array.length = 10;
console.log(array)
array[7] = 8
console.log(array)
console.log(array[9])

2. 通過下標新增，如果下標超出范圍賦值元素, 則會給指定位置插入新元素

let array = new Array()
console.log(array)
for(i = 0; i < 10; i++) {
    array[i] = i;
}
console.log(array)

3. 使用 push 進行追加元素

let array = new Array()
console.log(array)
for(i = 0; i < 10; i++) {
    array[i] = i;
}
let new_array = new Array()
// 將array中所有的元素追加到new_array中
for(i = 0 ;i < array.length; i++) {
    new_array.push(array[i])
}
console.log(new_array)

?? 刪除數(shù)組元素

使用 splice 方法刪除元素

let array = new Array()
console.log(array)
for(i = 0; i < 10; i++) {
    array[i] = i;
}
console.log(array)
// 第一個參數(shù)表示從下表為 1 的位置開始刪除. 第二個參數(shù)表示要刪除的元素個數(shù)是 2 個
array.splice(1, 1)
console.log(array)

七、函數(shù)

?? 語法格式

// 創(chuàng)建函數(shù)/函數(shù)聲明/函數(shù)定義
function 函數(shù)名(形參列表) {
	函數(shù)體
	return 返回值;
}
// 函數(shù)調(diào)用
函數(shù)名(實參列表) // 不考慮返回值
返回值 = 函數(shù)名(實參列表) // 考慮返回值

注意：

• 函數(shù)定義并不會執(zhí)行函數(shù)體內(nèi)容，必須要調(diào)用才會執(zhí)行，調(diào)用幾次就會執(zhí)行幾次

function hello() {
	console.log("hello");
}
// 如果不調(diào)用函數(shù), 則沒有執(zhí)行打印語句
hello();

• 調(diào)用函數(shù)的時候進入函數(shù)內(nèi)部執(zhí)行，函數(shù)結(jié)束時回到調(diào)用位置繼續(xù)執(zhí)行，可以借助調(diào)試器來觀察
• 函數(shù)的定義和調(diào)用的先后順序沒有要求(這一點和變量不同，變量必須先定義再使用)

// 調(diào)用函數(shù)
hello();
// 定義函數(shù)
function hello() {
	console.log("hello");
}

案例

• 定義的沒有參數(shù)列表，也沒有返回值的一個函數(shù)

function hello() {
    console.log("hello")
}
hello()

• 定義一個有參數(shù)列表，有返回值的一個函數(shù)

function HelloXiaobite(num, name) {
    console.log(num + " Hello " + name)
    return 1;
}
HelloXiaobite(1, "小明")

如果我們將一個函數(shù)返回值賦值給一個變量，那么函數(shù)的返回值是什么類型，這個變量就是什么類型。

function HelloXiaobite(num, name) {
    console.log(num + " Hello " + name)
    return 1;
}
let b = HelloXiaobite(1, "小明")
console.log(typeof(b));

?? 關(guān)于參數(shù)個數(shù)

實參和形參之間的個數(shù)可以不匹配，但是實際開發(fā)一般要求形參和實參個數(shù)要匹配

1. 如果實參個數(shù)比形參個數(shù)多, 則多出的參數(shù)不參與函數(shù)運算

sum(10, 20, 30); // 30

2. 如果實參個數(shù)比形參個數(shù)少, 則此時多出來的形參值為 undefined

sum(10); // NaN, 相當于 num2 為 undefined

JS 的函數(shù)傳參比較靈活, 這一點和其他語言差別較大. 事實上這種靈活性往往不是好事。

案例：

function HelloXiaobite(num, name) {
    console.log(num + " Hello " + name)
    return 1;
}
HelloXiaobite();
HelloXiaobite(1, "小明", 3)

?? 函數(shù)表達式

我們可以在定義函數(shù)時在最前面賦給一個變量，后面就可以通過這個變量來調(diào)用函數(shù)了。

let result = function Sum() {
    // 計算1~100之間的和
    ret = 0
    for(i = 0; i <= 100; i++) {
        ret += i
    }
    return ret
}
console.log(result())

當然在這里我們可以省略函數(shù)名，變量 = function() { } 這樣的寫法定義了一個匿名函數(shù)，隨后直接通過這個變量來調(diào)用函數(shù)。

let b = function() {
    console.log(arguments)
}
b();
b(1, 2, 3)

?? 作用域

某個標識符名字在代碼中的有效范圍，在 ES6 標準之前, 作用域主要分成兩個：

• 全局作用域: 在整個 script 標簽中, 或者單獨的 js 文件中生效
• 局部作用域/函數(shù)作用域: 在函數(shù)內(nèi)部生效

例如：

for(i = 0; i <= 100; i++) {

}
console.log(i)
// 在JS，在for循環(huán)中如果變量沒有通過let，var定義，此時就變成一個全局變量

例如：

let j = 0
for(let i = 0; i <= 100; i++) {
    j += i
}
console.log(j)

?? 作用域鏈

• 函數(shù)可以定義在函數(shù)內(nèi)部
• 內(nèi)層函數(shù)可以訪問外層函數(shù)的局部變量.

內(nèi)部函數(shù)可以訪問外部函數(shù)的變量，采取的是鏈式查找的方式，從內(nèi)到外依次進行查找。

let num = 10
function test01() {
   let num = 100
   console.log(num)
   function test02() {
       let num = 200
       console.log(num)
   }
   test02()
}
test01()

八、對象

1. JS創(chuàng)建對象

?? 使用 字面量 創(chuàng)建對象 [常用]

let a = {}
let student = {
    name:"蔡徐坤",
    height:"175",
    weight:"170kg",
    sayHello:function() {
        console.log("Hello")
    }
}

• 使用 { } 創(chuàng)建對象
• 屬性和方法使用鍵值對的形式來組織.
• 鍵值對之間使用 , 分割 最后一個屬性后面的 , 可有可無
• 鍵和值之間使用 : 分割.
• 方法的值是一個匿名函數(shù)

使用對象的屬性和方法：

1. 使用 . 成員訪問運算符來訪問屬性 . 可以理解成 “的”
   console.log(student.name);
2. 使用 [ ] 訪問屬性, 此時屬性需要加上引號
   console.log(student[‘height’]);
3. 調(diào)用方法, 別忘記加上 ()
   student.sayHello();

?? 使用 new Object 創(chuàng)建對象

let student = new Object()
student.name = "小明"
student.height = 180
student['weight'] = 75
student.SayHello = function() {
    console.log("Say Hello")
}
console.log(student.name)
console.log(student['height'])
student.SayHello()

?? 使用 構(gòu)造函數(shù) 創(chuàng)建對象

function 構(gòu)造函數(shù)名(形參) {
	this.屬性 = 值;
	this.方法 = function...
}
var obj = new 構(gòu)造函數(shù)名(實參);

例如：

function People(name, height, weight) {
    this.name = name
    this.height = height
    this.weight = weight
    this.Say = function() {
        console.log(name + "say hello")
    }
}
let xiaoming = new People("小明", 175, 75)
let zhangsan = new People("張三", 175, 75)
console.log(xiaoming)
xiaoming.Say()
console.log(zhangsan)
zhangsan.Say()

?? 理解 new 關(guān)鍵字

new 的執(zhí)行過程:

1. 先在內(nèi)存中創(chuàng)建一個空的對象 { }
2. this 指向剛才的空對象(將上一步的對象作為 this 的上下文)
3. 執(zhí)行構(gòu)造函數(shù)的代碼, 給對象創(chuàng)建屬性和方法
4. 返回這個對象 (構(gòu)造函數(shù)本身不需要 return, 由 new 代勞了)

2. JavaScript 的對象和 Java 的對象的區(qū)別

1. JavaScript 沒有 “類” 的概念
   對象其實就是 “屬性” + “方法” .
   類相當于把一些具有共性的對象的屬性和方法單獨提取了出來, 相當于一個 “月餅?zāi)Ｗ印?br> 在 JavaScript 中的 “構(gòu)造函數(shù)” 也能起到類似的效果.
   而且即使不是用構(gòu)造函數(shù), 也可以隨時的通過 { } 的方式指定出一些對象
   在 ES6 中也引入了 class 關(guān)鍵字, 就能按照類似于 Java 的方式創(chuàng)建類和對象了
2. JavaScript 對象不區(qū)分 “屬性” 和 “方法”
   JavaScript 中的函數(shù)是 “一等公民”, 和普通的變量一樣. 存儲了函數(shù)的變量能夠通過 ( ) 來進行調(diào)用執(zhí)行
3. JavaScript 對象沒有 private / public 等訪問控制機制
   對象中的屬性都可以被外界隨意訪問
4. JavaScript 對象沒有 “繼承”
   繼承本質(zhì)就是 “讓兩個對象建立關(guān)聯(lián)”. 或者說是讓一個對象能夠重用另一個對象的屬性/方法，JavaScript 中使用 “原型” 機制實現(xiàn)類似的效果
5. JavaScript 沒有 “多態(tài)”
   多態(tài)的本質(zhì)在于 “程序猿不必關(guān)注具體的類型, 就能使用其中的某個方法”，C++ / Java 等靜態(tài)類型的語言對于類型的約束和校驗比較嚴格. 因此通過 子類繼承父類, 并重寫父類的方法的方式 來實現(xiàn)多態(tài)的效果。但是在 JavaScript 中本身就支持動態(tài)類型, 程序猿在使用對象的某個方法的時候本身也不需要對對象的類型做出明確區(qū)分. 因此并不需要在語法層面上支持多態(tài)。
   • 例如，在 Java 中已經(jīng)學過 ArrayList 和 LinkedList. 為了讓程序猿使用方便, 往往寫List<String> list = new ArrayList<>()，然后我們可以寫一個方法：
     
     我們不必關(guān)注 list 是 ArrayList 還是 LinkedList, 只要是 List 就行. 因為 List 內(nèi)部帶有 add 方法.
     當我們使用 JavaScript 的代碼的時候
     
     add 對于 list 這個參數(shù)的類型本身就沒有任何限制. 只需要 list 這個對象有 add 方法即可. 就不必
     像 Java 那樣先繼承再重寫繞一個圈子

3. class創(chuàng)建類 | static關(guān)鍵字的理解 | 繼承

?? class創(chuàng)建類

當我們使用class關(guān)鍵字創(chuàng)建類的時候，構(gòu)造函數(shù)名為關(guān)鍵字constructor

class People {
    constructor(name, height, weight) {
        this.name = name
        this.height = height
        this.weight = weight
    }
    Say() {
        console.log(this.name + "正在說:Hello")
    }
}
let xiaoming = new People("小明", 175, 75)
console.log(xiaoming)
xiaoming.Say()

?? static關(guān)鍵字的理解

如果我們想要讓類中的一些成員屬于類而不是屬于某個對象時，就可以使用static關(guān)鍵字來修飾它。

class People {
  constructor(name, height, weight) {
      this.name = name
      this.height = height
      this.weight = weight
  }
  Say() {
      console.log(this.name + "正在說:Hello")
  }
  static other = "other"
  static Sum() {
      return 100
  }
}
let xiaoming = new People("小明", 175, 75)
alert(People.other)
alert(People.Sum())

當我們使用某個對象去訪問static修飾的成員變量或者成員方法時，就會報錯。

?? 繼承

繼承的關(guān)鍵字和Java中是一樣的，都是使用extends關(guān)鍵字。

class People {
    constructor(name, height, weight) {
        this.name = name
        this.height = height
        this.weight = weight
    }
    Say() {
        console.log(this.name + "正在說:Hello")
    }
    static other = "other"
    static Sum() {
        return 100
    }
}
class Student extends People {
    constructor(name, height, weight, number) {
        super(name, height, weight)
        this.number = number
    }
    Say() {
        alert(this.name)
    }
}
let student = new Student("張三", 180, 70, 1)
console.log(student)
student.Say()

九、總結(jié)

盡管Java和JavaScript有相似的名稱，但他們是兩種不同的編程語言，它們有著不同的應(yīng)用領(lǐng)域、語法和類型系統(tǒng)、執(zhí)行環(huán)境以及對象模型和生態(tài)系統(tǒng)。JavaScript在Web開發(fā)領(lǐng)域有著豐富的庫和框架，如React、Angular和Vue等，但與Java相比，JavaScript的生態(tài)系統(tǒng)更為注重于Web開發(fā)。文章來源地址http://www.zghlxwxcb.cn/news/detail-703927.html

到了這里，關(guān)于【JavaScript】JS語法入門到實戰(zhàn)的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！