JavaScript

第一章——初始JavaScript

1.1 瀏覽器執(zhí)行 JS 簡(jiǎn)介

瀏覽器分成兩部分：渲染引擎和 JS 引擎

• 渲染引擎：用來(lái)解析HTML與CSS，俗稱內(nèi)核，比如 chrome 瀏覽器的 blink ，老版本的 webkit

• JS 引擎：也稱為 JS 解釋器。 用來(lái)讀取網(wǎng)頁(yè)中的JavaScript代碼，對(duì)其處理后運(yùn)行，比如 chrome 瀏覽器的 V8

1.2 JS的組成

1.2.1 ECMAScript

• ECMAScript 是由ECMA 國(guó)際（ 原歐洲計(jì)算機(jī)制造商協(xié)會(huì)）進(jìn)行標(biāo)準(zhǔn)化的一門編程語(yǔ)言，這種語(yǔ)言在萬(wàn)維網(wǎng)上應(yīng)用廣泛，它往往被稱為 JavaScript 或 JScript，但實(shí)際上后兩者是 ECMAScript 語(yǔ)言的實(shí)現(xiàn)和擴(kuò)展。

1.2.2 DOM ——文檔對(duì)象模型

• 文檔對(duì)象模型（Document Object Model，簡(jiǎn)稱DOM），是W3C組織推薦的處理可擴(kuò)展標(biāo)記語(yǔ)言的標(biāo)準(zhǔn)編程接口。通過(guò) DOM 提供的接口可以對(duì)頁(yè)面上的各種元素進(jìn)行操作（大小、位置、顏色等）。

1.2.3 BOM ——瀏覽器對(duì)象模型

• BOM (Browser Object Model，簡(jiǎn)稱BOM) 是指瀏覽器對(duì)象模型，它提供了獨(dú)立于內(nèi)容的、可以與瀏覽器窗口進(jìn)行互動(dòng)的對(duì)象結(jié)構(gòu)。通過(guò)BOM可以操作瀏覽器窗口，比如彈出框、控制瀏覽器跳轉(zhuǎn)、獲取分辨率等

1.3 JS的寫法

• 行內(nèi)式寫法
• 內(nèi)嵌 JS
• 外部 JS 文件

1.3.1 行內(nèi)式寫法

<input type="button" value="點(diǎn)我試試" onclick="alert('Hello World')" />

• 可以將單行或少量 JS 代碼寫在HTML標(biāo)簽的事件屬性中（以 on 開(kāi)頭的屬性），如：onclick
• 注意單雙引號(hào)的使用：在HTML中我們推薦使用雙引號(hào), JS 中我們推薦使用單引號(hào)
• 可讀性差， 在html中編寫JS大量代碼時(shí)，不方便閱讀；
• 引號(hào)易錯(cuò)，引號(hào)多層嵌套匹配時(shí)，非常容易弄混；
• 特殊情況下使用

1.3.2 內(nèi)嵌式寫法

<script>
    alert('Hello  World~!');
 </script>

• l可以將多行JS代碼寫到

1.3.3 外部js文件

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

• src為js文件的路徑
• 這樣可以單獨(dú)開(kāi)一個(gè)js文件，將所有JavaScript代碼放在外部的一個(gè)js文件中

1.4 注釋

• 單行注釋：//
• 多行注釋：/注釋內(nèi)容/

1.5 變量

1.5.1 變量聲明

var a; var b;

• 這樣就聲明了一個(gè)變量a

1.5.2 變量賦值

a=20;b="hello world";

a，b可以被賦值為任意數(shù)據(jù)類型的值

1.5.3 聲明多個(gè)變量

• 同時(shí)聲明多個(gè)變量時(shí)，只需要寫一個(gè) var， 多個(gè)變量名之間使用英文逗號(hào)隔開(kāi)。

var a = 10,  b = 'yy', c = 2;       

1.6 輸入與輸出

**注意：**alert() 主要用來(lái)顯示消息給用戶，console.log() 用來(lái)給程序員自己看運(yùn)行時(shí)的消息。

1.6.1 格式化輸出

alert(“提示”：+變量)

alert('結(jié)果是'+result)

// 1. 先彈出第一個(gè)輸入框，提示用戶輸入第一個(gè)值 
 var num1 = prompt('請(qǐng)輸入第一個(gè)值：');
// 2. 再?gòu)棾龅诙€(gè)框，提示用戶輸入第二個(gè)值 
 var num2 = prompt('請(qǐng)輸入第二個(gè)值：');
// 3. 將輸入的值轉(zhuǎn)換為數(shù)字型后，把這兩個(gè)值相加，并將結(jié)果賦給新的變量  
 var result = parseFloat(num1) + parseFloat(num2);
// 4. 彈出結(jié)果
 alert('結(jié)果是:' + result);

1.6.2 輸入

• prompt輸入的變量類型均為字符串類型

第二章——數(shù)據(jù)類型

JS 把數(shù)據(jù)類型分為兩類：

• 簡(jiǎn)單數(shù)據(jù)類型 （Number,String,Boolean,Undefined,Null）
• 復(fù)雜數(shù)據(jù)類型 （object)

2.1 簡(jiǎn)單數(shù)據(jù)類型：

• 在JS中八進(jìn)制前面加0，十六進(jìn)制前面加 0x

2.1.1 數(shù)字類型

• 數(shù)字類型的三個(gè)特殊值

alert(Infinity);  // Infinity
alert(-Infinity); // -Infinity
alert(NaN);       // NaN

• 判斷是否為數(shù)字——isNaN()
  

var a = 21;
var b = isNaN(a);
console.log(isNaN(a))//false
var c = "hello";
console.log(isNaN(c));  // true ，"hello"是一個(gè)非數(shù)字

2.1.2 轉(zhuǎn)義字符

2.1.3 字符串類型

• 獲取字符串長(zhǎng)度 string.length

var a='hello world'
console.log(a.length)//11

• 字符串拼接 使用 + 號(hào)

var a='hello world '
var b='yeye for the first'
console.log(a+b)//hello world yeye for the first

2.2 獲取數(shù)據(jù)類型 typeof

var num = 24;
console.log(typeof num) // 結(jié)果 number      

不同類型返回值

第三章——操作符

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

3.2 遞增和遞減運(yùn)算符

如果需要反復(fù)給數(shù)字變量添加或減去1，可以使用遞**增（++）和遞減（–）**運(yùn)算符來(lái)完成。

• 前置自增：++a 先自加，后返回值
• 后置自增：a++ 先返回原值，后自增

3.3 比較運(yùn)算符

3.4 = 符號(hào)

console.log(18 == '18');//true
console.log(18 === '18');//false

• js里面的==號(hào)會(huì)發(fā)生一個(gè)自動(dòng)轉(zhuǎn)型

3.5 邏輯運(yùn)算符

• 概念：邏輯運(yùn)算符是用來(lái)進(jìn)行布爾值運(yùn)算的運(yùn)算符，其返回值也是布爾值。
  

第四章——流程控制

4.1 if語(yǔ)句

1. 語(yǔ)法結(jié)構(gòu)

// 條件成立執(zhí)行代碼，否則什么也不做
if (條件表達(dá)式) {
    // 條件成立執(zhí)行的代碼語(yǔ)句
}

2. if else語(yǔ)句（雙分支語(yǔ)句）

// 條件成立  執(zhí)行 if 里面代碼，否則執(zhí)行else 里面的代碼
if (條件表達(dá)式) {
    // [如果] 條件成立執(zhí)行的代碼
} else {
    // [否則] 執(zhí)行的代碼
}

3. if else if 語(yǔ)句 ( 多分支語(yǔ)句 )

// 適合于檢查多重條件。
if (條件表達(dá)式1) {
    語(yǔ)句1；
} else if (條件表達(dá)式2)  {
    語(yǔ)句2；
} else if (條件表達(dá)式3)  {
   語(yǔ)句3；
 ....
} else {
    // 上述條件都不成立執(zhí)行此處代碼
}

4.2 三元表達(dá)式

1. 語(yǔ)法結(jié)構(gòu)

表達(dá)式1 ? 表達(dá)式2 : 表達(dá)式3;

• 如果表達(dá)式1為 true ，則返回表達(dá)式2的值，如果表達(dá)式1為 false，則返回表達(dá)式3的值

• 簡(jiǎn)單理解： 就類似于 if else （雙分支） 的簡(jiǎn)寫

var time = prompt('請(qǐng)輸入一個(gè)數(shù)字');
// 三元表達(dá)式 表達(dá)式 ？ 表達(dá)式1 ：表達(dá)式2 
var result = (time < 10 ?  time+'比10小' : time+'不比10小'); // 把返回值賦值給一個(gè)變量
alert(result);

4.3 分支流程控制switch 語(yǔ)句

1. 語(yǔ)法結(jié)構(gòu)

switch( 表達(dá)式 ){ 
    case value1:
        // 表達(dá)式 等于 value1 時(shí)要執(zhí)行的代碼
        break;
    case value2:
        // 表達(dá)式 等于 value2 時(shí)要執(zhí)行的代碼
        break;
    default:
        // 表達(dá)式 不等于任何一個(gè) value 時(shí)要執(zhí)行的代碼
}

2. 語(yǔ)法說(shuō)明

• switch ：開(kāi)關(guān) 轉(zhuǎn)換 ， case ：小例子 選項(xiàng)

• 關(guān)鍵字 switch 后面括號(hào)內(nèi)可以是表達(dá)式或值， 通常是一個(gè)變量

• 關(guān)鍵字 case , 后跟一個(gè)選項(xiàng)的表達(dá)式或值，后面跟一個(gè)冒號(hào)

• switch 表達(dá)式的值會(huì)與結(jié)構(gòu)中的 case 的值做比較

• 如果存在匹配全等(===) ，則與該 case 關(guān)聯(lián)的代碼塊會(huì)被執(zhí)行，并在遇到 break 時(shí)停止，整個(gè) switch 語(yǔ)句代碼執(zhí)行結(jié)束

• 如果所有的 case 的值都和表達(dá)式的值不匹配，則執(zhí)行 default 里的代碼

第五章——循環(huán)結(jié)構(gòu)

5.1 for循環(huán)

• 在程序中，一組被重復(fù)執(zhí)行的語(yǔ)句被稱之為循環(huán)體，能否繼續(xù)重復(fù)執(zhí)行，取決于循環(huán)的終止條件。由循環(huán)體及循環(huán)的終止條件組成的語(yǔ)句，被稱之為循環(huán)語(yǔ)句

5.1.1 語(yǔ)法結(jié)構(gòu)

for(初始化變量; 條件表達(dá)式; 操作表達(dá)式 ){
    //循環(huán)體
}

• 初始化變量：通常被用于初始化一個(gè)計(jì)數(shù)器，該表達(dá)式可以使用 var 關(guān)鍵字聲明新的變量，這個(gè)變量幫我們來(lái)記錄次數(shù)。

• 條件表達(dá)式：用于確定每一次循環(huán)是否能被執(zhí)行。如果結(jié)果是 true 就繼續(xù)循環(huán)，否則退出循環(huán)。

• 操作表達(dá)式：每次循環(huán)的最后都要執(zhí)行的表達(dá)式。通常被用于更新或者遞增計(jì)數(shù)器變量。當(dāng)然，遞減變量也是可以的。

5.2 while 循環(huán)

• while 語(yǔ)句可以在條件表達(dá)式為真的前提下，循環(huán)執(zhí)行指定的一段代碼，直到表達(dá)式不為真時(shí)結(jié)束循環(huán)。

5.2.1 語(yǔ)法結(jié)構(gòu)

while (條件表達(dá)式) {
    // 循環(huán)體代碼 
}

• 說(shuō)明

①先執(zhí)行條件表達(dá)式，如果結(jié)果為 true，則執(zhí)行循環(huán)體代碼；如果為 false，則退出循環(huán)，執(zhí)行后面代碼

②執(zhí)行循環(huán)體代碼

③循環(huán)體代碼執(zhí)行完畢后，程序會(huì)繼續(xù)判斷執(zhí)行條件表達(dá)式，如條件仍為true，則會(huì)繼續(xù)執(zhí)行循環(huán)體，直到循環(huán)條件為 false 時(shí)，整個(gè)循環(huán)過(guò)程才會(huì)結(jié)束

5.3 do while 循環(huán)

5.3.1 語(yǔ)法結(jié)構(gòu)

• do… while 循環(huán)會(huì)先執(zhí)行一次代碼塊，然后對(duì)條件表達(dá)式進(jìn)行判斷，如果條件為真，就會(huì)重復(fù)執(zhí)行循環(huán)體，否則退出循環(huán)。

do {
    // 循環(huán)體代碼 - 條件表達(dá)式為 true 時(shí)重復(fù)執(zhí)行循環(huán)體代碼
} while(條件表達(dá)式);

5.4 continue與break

• continue：立即跳出本次循環(huán)，繼續(xù)下一次循環(huán)

• break：break 關(guān)鍵字用于立即跳出整個(gè)循環(huán)（循環(huán)結(jié)束）

第六章——數(shù)組

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

6.1.1 new創(chuàng)建

var 數(shù)組名 = new Array() ；
var arr = new Array();   // 創(chuàng)建一個(gè)新的空數(shù)組

• 注意 Array () ，A 要大寫

6.1.2 利用數(shù)組字面量創(chuàng)建數(shù)組

//1. 使用數(shù)組字面量方式創(chuàng)建空的數(shù)組
var  數(shù)組名 = []；
//2. 使用數(shù)組字面量方式創(chuàng)建帶初始值的數(shù)組
var  數(shù)組名 = ['小白','小黑','大黃','瑞奇'];

• 類似python中 的列表
• 數(shù)組的字面量是方括號(hào) [ ]
• 數(shù)組中可以存放任意類型的數(shù)據(jù)，例如字符串，數(shù)字，布爾值等。

6.2 數(shù)組索引與切片

6.2.1 索引

• **索引 (下標(biāo)) ：**用來(lái)訪問(wèn)數(shù)組元素的序號(hào)（數(shù)組下標(biāo)從 0 開(kāi)始）。

// 定義數(shù)組
var arr = [1,2,3];
// 獲取數(shù)組中的第2個(gè)元素
alert(arr[1]);//彈出2    

6.2.2 獲取數(shù)組長(zhǎng)度

var arr=[1,2,3]
console.log(arr.length)//輸出3

6.3 數(shù)組相關(guān)操作

6.3.1 數(shù)組新增元素

1. 通過(guò)修改 length長(zhǎng)度新增數(shù)組元素

var arr = ['red', 'green', 'blue', 'pink'];
console.log(arr);//['red', 'green', 'blue', 'pink']
arr.length = 7;
arr[4]='black'
console.log(arr)//['red', 'green', 'blue', 'pink', 'black', empty × 2]

• 可以通過(guò)修改 length 長(zhǎng)度來(lái)實(shí)現(xiàn)數(shù)組擴(kuò)容的目的
• length 屬性是可讀寫的

2. 直接通過(guò)索引進(jìn)行新增元素

var arr = ['red', 'green', 'blue', 'pink'];
arr[4] = 'hotpink';
console.log(arr);

第七章——函數(shù)

7.1 函數(shù)使用

7.1.1 聲明函數(shù)

// 聲明函數(shù)
function 函數(shù)名() {
    //函數(shù)體代碼
}

• function 是聲明函數(shù)的關(guān)鍵字,必須小寫

7.1.2 調(diào)用函數(shù)

// 調(diào)用函數(shù)
函數(shù)名();  // 通過(guò)調(diào)用函數(shù)名來(lái)執(zhí)行函數(shù)體代碼

• 調(diào)用的時(shí)候千萬(wàn)不要忘記添加小括號(hào)

7.2 函數(shù)參數(shù)

7.2.1 形參和實(shí)參

• 在聲明函數(shù)時(shí)，可以在函數(shù)名稱后面的小括號(hào)中添加一些參數(shù)，這些參數(shù)被稱為形參，而在調(diào)用該函數(shù)時(shí)，同樣也需要傳遞相應(yīng)的參數(shù)，這些參數(shù)被稱為實(shí)參
  

• 參數(shù)的作用 : 在函數(shù)內(nèi)部某些值不能固定，我們可以通過(guò)參數(shù)在調(diào)用函數(shù)時(shí)傳遞不同的值進(jìn)去

// 聲明函數(shù)
function getSum(num1, num2) {
    console.log(num1 + num2);
}
// 調(diào)用函數(shù)
getSum(1, 3); // 4
getSum(6, 5); // 11

7.2.2 函數(shù)形參和實(shí)參個(gè)數(shù)不匹配問(wèn)題

function sum(num1, num2) {
    console.log(num1 + num2);
}
sum(100, 200);             // 形參和實(shí)參個(gè)數(shù)相等，輸出正確結(jié)果
sum(100, 400, 500, 700);   // 實(shí)參個(gè)數(shù)多于形參，只取到形參的個(gè)數(shù)
sum(200);                  // 實(shí)參個(gè)數(shù)少于形參，多的形參定義為undefined，結(jié)果為NaN

注意點(diǎn)：

• 在JavaScript中，形參的默認(rèn)值是undefined。
• 函數(shù)可以帶參數(shù)也可以不帶參數(shù)
• 聲明函數(shù)的時(shí)候，函數(shù)名括號(hào)里面的是形參，形參的默認(rèn)值為 undefined
• 調(diào)用函數(shù)的時(shí)候，函數(shù)名括號(hào)里面的是實(shí)參
• 多個(gè)參數(shù)中間用逗號(hào)分隔
• 形參的個(gè)數(shù)可以和實(shí)參個(gè)數(shù)不匹配，但是結(jié)果不可預(yù)計(jì)，我們盡量要匹配

7.3 函數(shù)返回值

• 在定義函數(shù)的時(shí)候，用return語(yǔ)句代表這個(gè)函數(shù)的返回值，函數(shù)內(nèi)程序一旦執(zhí)行到return 語(yǔ)句，代表該函數(shù)執(zhí)行結(jié)束

// 聲明函數(shù)
function sum（）{
    ...
    return  918；
}
// 調(diào)用函數(shù)
a=sum();      // 此時(shí) a的值就等于918，因?yàn)?return 語(yǔ)句會(huì)把自身后面的值返回給調(diào)用者 

• return 只能返回一個(gè)值。如果用逗號(hào)隔開(kāi)多個(gè)值，以最后一個(gè)為準(zhǔn)。

function add(num1，num2){
    //函數(shù)體
    return num1，num2;
}
var resNum = add(8,6); // 調(diào)用函數(shù)，傳入兩個(gè)實(shí)參，并通過(guò) resNum 接收函數(shù)返回值
alert(resNum);          // 6

7.4 arguments使用

• 不確定有多少個(gè)參數(shù)傳遞的時(shí)候，可以用 arguments 來(lái)獲取。
• 在 JavaScript 中，arguments 實(shí)際上它是當(dāng)前函數(shù)的一個(gè)內(nèi)置對(duì)象。所有函數(shù)都內(nèi)置了一個(gè) arguments 對(duì)象，arguments 對(duì)象中存儲(chǔ)了傳遞的所有實(shí)參。

7.4.1 arguments屬性

arguments展示形式是一個(gè)偽數(shù)組，因此可以進(jìn)行遍歷。偽數(shù)組具有以下特點(diǎn)：

• 具有 length 屬性

• 按索引方式儲(chǔ)存數(shù)據(jù)

• 不具有數(shù)組的 push , pop 等方法

7.5 匿名函數(shù)

表達(dá)式寫法

// 這是函數(shù)表達(dá)式寫法，匿名函數(shù)后面跟分號(hào)結(jié)束
var fn = function(){...}；
// 調(diào)用的方式，函數(shù)調(diào)用必須寫到函數(shù)體下面
fn();

• 因?yàn)楹瘮?shù)沒(méi)有名字，所以也被稱為匿名函數(shù)
• 這個(gè)fn 里面存儲(chǔ)的是一個(gè)函數(shù)
• 函數(shù)表達(dá)式方式原理跟聲明變量方式是一致的
• 函數(shù)調(diào)用的代碼必須寫到函數(shù)體后面

第八章——作用域

8.1 全局作用域

• 作用于所有代碼執(zhí)行的環(huán)境(整個(gè) script 標(biāo)簽內(nèi)部)或者一個(gè)獨(dú)立的 js 文件。

8.2 局部作用域

• 作用于函數(shù)內(nèi)的代碼環(huán)境，就是局部作用域。 因?yàn)楦瘮?shù)有關(guān)系，所以也稱為函數(shù)作用域。

8.3 塊級(jí)作用域

• Js中沒(méi)有塊級(jí)作用域（在ES6之前）

for(var a=1;a<5;a++)
{
    console.log(a)
}
console.log('局部變量a的值為：'+a)//5

8.4 JavaScript預(yù)解析

• **預(yù)解析：**在當(dāng)前作用域下, JS 代碼執(zhí)行之前，瀏覽器會(huì)默認(rèn)把帶有 var 和 function 聲明的變量在內(nèi)存中進(jìn)行提前聲明或者定義。

console.log(num);  // 結(jié)果是多少？
var num = 10;  //undefined

說(shuō)明聲明可以提前，但是賦值不會(huì)被提前

• 代碼執(zhí)行： 從上到下執(zhí)行JS語(yǔ)句。

預(yù)解析只會(huì)發(fā)生在通過(guò) var 定義的變量和 function 上。學(xué)習(xí)預(yù)解析能夠讓我們知道為什么在變量聲明之前訪問(wèn)變量的值是 undefined，為什么在函數(shù)聲明之前就可以調(diào)用函數(shù)。

fn();
function fn() {
    console.log('打印');
}
//輸出了打印

因?yàn)槁暶骺梢员惶崆?，所以調(diào)用這個(gè)函數(shù)依然可以直接輸出結(jié)果

第九章——面向?qū)ο?/h3>

9.1 對(duì)象基本結(jié)構(gòu)

var star = {
    name : 'yeye',
    age : 24,
    sex : '女',
    sayHi : function(){
        alert('hello world');
    }
};

說(shuō)明：

• 用花括號(hào) { } 里面包含了表達(dá)這個(gè)具體事物（對(duì)象）的屬性和方法。

• { } 里面采取鍵值對(duì)的形式表示

• 鍵：相當(dāng)于屬性名

• 值：相當(dāng)于屬性值，可以是任意類型的值（數(shù)字類型、字符串類型、布爾類型，函數(shù)類型等）

9.2 對(duì)象的調(diào)用

• 對(duì)象里面的屬性調(diào)用 : 對(duì)象.屬性名 ，這個(gè)小點(diǎn) . 就理解為“ 的 ”

• 對(duì)象里面屬性的另一種調(diào)用方式 : 對(duì)象[‘屬性名’]**，**注意方括號(hào)里面的屬性必須加引號(hào)，我們后面會(huì)用

• 對(duì)象里面的方法調(diào)用：對(duì)象.方法名() **，**注意這個(gè)方法名字后面一定加括號(hào)

//star為一個(gè)對(duì)象  sayHI為對(duì)象里面的一個(gè)函數(shù)
console.log(star.name)     // 調(diào)用名字屬性
console.log(star['name'])  // 調(diào)用名字屬性
star.sayHi();              // 調(diào)用 sayHi 方法,注意，一定不要忘記帶后面的括號(hào)

9.3 對(duì)象創(chuàng)建

9.3.1 直接創(chuàng)建

var idle = {
    name : 'yeye',
    age : 24,
    sex : '女',
    sayHi : function(){
        alert('for the first place');
    }
};

9.3.2 使用 new Object創(chuàng)建對(duì)象

var andy = new Object();
andy.name = 'yeye';
andy.age = 24;
andy.sex = '女';
andy.sayHi = function(){
    alert('hello');
}
console.log(andy.name)//yeye
/*
先使用new Object創(chuàng)建一個(gè)對(duì)象，然后對(duì)其屬性進(jìn)行賦值
*/

• Object() ：第一個(gè)字母大寫
• new Object() ：需要 new 關(guān)鍵字
• 使用的格式：對(duì)象.屬性 = 值;

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

//這個(gè)Person其實(shí)就相當(dāng)于一個(gè)類（class）
function Person(name, age, sex) {
     this.name = name;
     this.age = age;
     this.sex = sex;
     this.sayHi = function() {
      alert('我的名字叫：' + this.name + '，年齡：' + this.age + '，性別：' + this.sex);
    }
}
var bigbai = new Person('大白', 100, '男');
var smallbai = new Person('小白', 21, '男');
console.log(bigbai.name);
console.log(smallbai.name);

• 構(gòu)造函數(shù) ：是一種特殊的函數(shù)，主要用來(lái)初始化對(duì)象，即為對(duì)象成員變量賦初始值，它總與 new 運(yùn)算符一起使用。我們可以把對(duì)象中一些公共的屬性和方法抽取出來(lái)，然后封裝到這個(gè)函數(shù)里面。

在 js 中，使用構(gòu)造函數(shù)要時(shí)要注意以下兩點(diǎn)：

• 構(gòu)造函數(shù)用于創(chuàng)建某一類對(duì)象，其首字母要大寫

• 構(gòu)造函數(shù)要和 new 一起使用才有意義

• 使用構(gòu)造函數(shù)注意點(diǎn)：
  • 構(gòu)造函數(shù)約定首字母大寫。
  • 函數(shù)內(nèi)的屬性和方法前面需要添加 this ，表示當(dāng)前對(duì)象的屬性和方法。
  • 構(gòu)造函數(shù)中不需要 return 返回結(jié)果。
  • 當(dāng)我們創(chuàng)建對(duì)象的時(shí)候，必須用 new 來(lái)調(diào)用構(gòu)造函數(shù)。

9.4 遍歷對(duì)象屬性

9.4.1. 語(yǔ)法結(jié)構(gòu)

for (變量 in 對(duì)象名字) {
    console.log(key)//key為屬性名
    console.log(對(duì)象名[key])//輸出值
    // 在此執(zhí)行代碼
}

• 語(yǔ)法中的變量是自定義的，它需要符合命名規(guī)范，通常我們會(huì)將這個(gè)變量寫為 k 或者 key。

9.4.2 代碼示例

var andy = new Object();
andy.name = 'yeye';
andy.age = 24;
andy.sex = '女';
andy.sayHi = function(){
    alert('hello');
}
/*
先使用new Object創(chuàng)建一個(gè)對(duì)象，然后對(duì)其屬性進(jìn)行賦值
*/
for(var key in andy)
{
    console.log(key+':'+andy[key])
}

第十章——常見(jiàn)內(nèi)置對(duì)象

10.1 對(duì)象定義

• JavaScript 中的對(duì)象分為3種：自定義對(duì)象 、內(nèi)置對(duì)象、 瀏覽器對(duì)象
• 前面兩種對(duì)象是JS 基礎(chǔ) 內(nèi)容，屬于 ECMAScript； 第三個(gè)瀏覽器對(duì)象屬于JS 獨(dú)有， JS API 中 講
• 內(nèi)置對(duì)象就是指 JS 語(yǔ)言自帶的一些對(duì)象，這些對(duì)象供開(kāi)發(fā)者使用，并提供了一些常用的或是最基本而必要的功能（屬性和方法）
• 內(nèi)置對(duì)象最大的優(yōu)點(diǎn)就是幫助我們快速開(kāi)發(fā)
• JavaScript 提供了多個(gè)內(nèi)置對(duì)象：Math、 Date 、Array、String等

10.2 一些內(nèi)置對(duì)象模塊

10.2.1 Math

Math.PI		 // 圓周率
Math.floor() 	 // 向下取整
Math.ceil()            // 向上取整
Math.round()           // 四舍五入版 就近取整   注意 -3.5   結(jié)果是  -3 
Math.abs()		 // 絕對(duì)值
Math.max()/Math.min()	 // 求最大和最小值 
Math.random()//隨機(jī)返回一個(gè)小數(shù)，其取值范圍是 [0，1)，左閉右開(kāi) 0 <= x < 1 

10.2.2 Date

• Date 對(duì)象和 Math 對(duì)象不一樣，他是一個(gè)構(gòu)造函數(shù)，所以我們需要實(shí)例化后才能使用
• Date 實(shí)例用來(lái)處理日期和時(shí)間

1. 獲取當(dāng)前時(shí)間

• 如果Date()不寫參數(shù)，就返回當(dāng)前時(shí)間

var now = new Date();
console.log(now);//Sat Jan 14 2023 19:57:15 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)

• 如果Date()里面寫參數(shù)，就返回括號(hào)里面輸入的時(shí)間

var now = new Date('2022-2-13');
console.log(now);//Sun Feb 13 2022 00:00:00 GMT+0800 (中國(guó)標(biāo)準(zhǔn)時(shí)間)

2. 日期格式化相關(guān)函數(shù)

getMonth（）方法可以返回表示月份的數(shù)字。返回值是0代表一月，11代表12月

getDay()方法返回一周里的某一天。返回值0代表星期天 ，一代表星期一，六代表星期六

var now = new Date();
console.log(now.getFullYear()+'-'+(now.getMonth()+1)+'-'+now.getDate()+' '+now.getHours()+':'+now.getMinutes());

10.2.3——數(shù)組對(duì)象 Array

1. 創(chuàng)建數(shù)組對(duì)象

new Array()

var a =new Array;
a[0]='hello'
a[1]='world'
console.log(a)//['hello', 'world']

2. 判斷是否為數(shù)組對(duì)象

• instanceof 運(yùn)算符，可以判斷一個(gè)對(duì)象是否屬于某種類型
• Array.isArray()用于判斷一個(gè)對(duì)象是否為數(shù)組，isArray() 是 HTML5 中提供的方法

var a =new Array;
a[0]='hello'
a[1]='world'
console.log(a instanceof Array)//true

3.添加刪除數(shù)組元素的方法

//push 追加元素
var a =new Array;
a[0]='hello'
a[1]='world'
a[2]='yeye'
console.log(a);//['hello', 'world', 'yeye']
a.push('haha')
console.log(a)//['hello', 'world', 'yeye', 'haha']

4 .數(shù)組排序

• sort方法能夠接受一個(gè)函數(shù)

var arr = [1, 64, 9, 6];
arr.sort(function(a, b) {
    return b - a;      // 降序
    // return a - b;   // 升序
});
console.log(arr);

• 這個(gè)參數(shù)函數(shù)的返回值決定了數(shù)組的排序。返回值大于0會(huì)變換兩個(gè)參數(shù)的位置，返回值小于0不會(huì)變換兩個(gè)參數(shù)的位置。
• 返回值大于0則為升序，返回值小于0則為降序
• 如果不加參數(shù)，則默認(rèn)為升序

5. 查找數(shù)組中特定元素的索引

var arr = [1, 64, 9, 6,6];
console.log(arr.indexOf(1));//0
console.log(arr.indexOf(9));//2
console.log(arr.lastIndexOf(6))//4

6. 數(shù)組轉(zhuǎn)換為字符串

• toString

var arr = [1, 64, 9, 6,6];
b=arr.toString()
console.log(b)
console.log(typeof b)

jion

var arr = [1, 64, 9, 6,6];
b=arr.join('+')
console.log(b)
console.log(typeof b)

7. 數(shù)組其他補(bǔ)充操作

• concat()

var arr = [1, 64, 9, 6,6];
var HII=[25,58,66,44]
a=arr.concat(HII)
console.log(a)

slice()

var arr = [1, 64, 9, 6,6];
var HII=[25,58,66,44]
a=arr.slice(2,4)
console.log(a)//[9, 6]

10.2.4 字符串對(duì)象

• 字符串所有的方法，都不會(huì)修改字符串本身(字符串是不可變的)，操作完成會(huì)返回一個(gè)新的字符串。

1. 返回字符位置

2. 根據(jù)索引返回字符串具體值

3. 字符串操作方法

4. replace()方法

• replace(被替換的字符串， 要替換為的字符串)；

var a='hello '
var b='world'
var c=a+b
console.log(c)
console.log(c.replace(c[0],b[0]))

• 注意字符串c本身是不會(huì)改變，字符串方法都是不會(huì)改變它本身的

5. split()方法

• split()方法用于切分字符串，它可以將字符串切分為數(shù)組。在切分完畢之后，返回的是一個(gè)新數(shù)組。

var a='he,llo '
var b='w,or,ld'
var c=a+b
console.log(c.split(','))// ['he', 'llo w', 'or', 'ld']

6. 轉(zhuǎn)換大小寫

• toUpperCase() //轉(zhuǎn)換大寫

• toLowerCase() //轉(zhuǎn)換小寫

var a='hello '
var b='world'
var c=a+b
var d=c.toUpperCase()
console.log(c.toUpperCase())//HELLO WORLD
console.log(d.toLocaleLowerCase())//hello world

第十一章——簡(jiǎn)單類型與復(fù)雜類型

11.1 簡(jiǎn)單類型與復(fù)雜類型概念

簡(jiǎn)單類型又叫做基本數(shù)據(jù)類型或者值類型，復(fù)雜類型又叫做引用類型。

• 值類型：簡(jiǎn)單數(shù)據(jù)類型/基本數(shù)據(jù)類型，在存儲(chǔ)時(shí)變量中存儲(chǔ)的是值本身，因此叫做值類型

string ，number，boolean，undefined，null

• 引用類型：復(fù)雜數(shù)據(jù)類型，在存儲(chǔ)時(shí)變量中存儲(chǔ)的僅僅是地址（引用），因此叫做引用數(shù)據(jù)類型

通過(guò) new 關(guān)鍵字創(chuàng)建的對(duì)象（系統(tǒng)對(duì)象、自定義對(duì)象），如 Object、Array、Date等

11.2 棧和堆

堆?？臻g分配區(qū)別：

1、棧（操作系統(tǒng)）：由操作系統(tǒng)自動(dòng)分配釋放存放函數(shù)的參數(shù)值、局部變量的值等。其操作方式類似于數(shù)據(jù)結(jié)構(gòu)中的棧；

• 簡(jiǎn)單數(shù)據(jù)類型存放到棧里面

2、堆（操作系統(tǒng)）：存儲(chǔ)復(fù)雜類型(對(duì)象)，一般由程序員分配釋放，若程序員不釋放，由垃圾回收機(jī)制回收。

• 復(fù)雜數(shù)據(jù)類型存放到堆里面

11.3 簡(jiǎn)單類型的內(nèi)存分配

• 值類型（簡(jiǎn)單數(shù)據(jù)類型）： string ，number，boolean，undefined，null

• 值類型變量的數(shù)據(jù)直接存放在變量（?？臻g）中

11.4 復(fù)雜類型的內(nèi)存分配

• 引用類型（復(fù)雜數(shù)據(jù)類型）：通過(guò) new 關(guān)鍵字創(chuàng)建的對(duì)象（系統(tǒng)對(duì)象、自定義對(duì)象），如 Object、Array、Date等

• 引用類型變量（棧空間）里存放的是地址，真正的對(duì)象實(shí)例存放在堆空間中

11.5 簡(jiǎn)單類型傳參：

• 函數(shù)的形參也可以看做是一個(gè)變量，當(dāng)我們把一個(gè)值類型變量作為參數(shù)傳給函數(shù)的形參時(shí)，其實(shí)是把變量在棧空間里的值復(fù)制了一份給形參，那么在方法內(nèi)部對(duì)形參做任何修改，都不會(huì)影響到的外部變量。

• 形參和實(shí)參是獨(dú)立的

11.6 復(fù)雜類型傳參

• 函數(shù)的形參也可以看做是一個(gè)變量，當(dāng)我們把引用類型變量傳給形參時(shí)，其實(shí)是把變量在棧空間里保存的堆地址復(fù)制給了形參，形參和實(shí)參其實(shí)保存的是同一個(gè)堆地址，所以操作的是同一個(gè)對(duì)象。

function Person(name)
{
    this.name = name;
}
function f1(x) 
{ // x = p   
    x.name = "yeye"; 
}
var p = new Person("瑤瑤");
console.log(p.name);    // 瑤瑤  
f1(p);
console.log(p.name);    // yeye

可以看到p.name屬性的值已經(jīng)被改變了

視頻教程：https://www.bilibili.com/video/BV1Sy4y1C7ha/?share_source=copy_web&vd_source=03653b285aec67f0157f73840202808d
對(duì)應(yīng)文檔（PDF+markdown格式）：https://download.csdn.net/download/weixin_63676550/87386435文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-754141.html

到了這里，關(guān)于學(xué)習(xí)筆記 JavaScript基礎(chǔ)語(yǔ)法（全）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！