是什么

• 一門(mén)腳本語(yǔ)言
• 一門(mén)解釋型語(yǔ)言
• 動(dòng)態(tài)類型語(yǔ)言
• 基于對(duì)象的語(yǔ)言
• 弱類型語(yǔ)言

使用場(chǎng)景

• 網(wǎng)頁(yè)特效
• 服務(wù)端開(kāi)發(fā)
• 命令行工具
• 桌面程序
• APP
• 控制硬件——物聯(lián)網(wǎng)
• 游戲開(kāi)發(fā)

區(qū)別

• HTML

  標(biāo)記語(yǔ)言袱箱，展示數(shù)據(jù)

• CSS

  美化頁(yè)面

• JavaScript

  動(dòng)態(tài)效果邀杏，與用戶的交互

組成

變量

作用

儲(chǔ)存數(shù)據(jù)或操作數(shù)據(jù)

聲明與初始化

聲明

? var num （此時(shí)沒(méi)有賦值）

初始化

? var num = 10 （此時(shí)賦值）

方式：

? var 變量名字

注意：

• 以下說(shuō)法一個(gè)意思：

        聲明變量并初始化
        
        變量的初始化
    
        聲明變量賦值
  

• 可以一次初始化多個(gè)值

  var num1 = 10, num2 = 20, num3 = 30

命名規(guī)范

• 區(qū)分大小寫(xiě)
• 第一個(gè)字符必須是字母忿墅、下劃線、或者 $
• 后面的字符可以是數(shù)字兑徘、字母贞瞒、下劃線叼旋、$
• 變量的名字要有意義
• 一般都是小寫(xiě)刃麸，并采用駝峰式
• 不能使用關(guān)鍵字
• 字符串可用單引號(hào)也可用雙引號(hào)

交換變量小案例

思路一：使用第三方變量

思路二：一般適用于數(shù)字交換（計(jì)算方式）

注釋

單行注釋：// 一般用在一行代碼上

多行注釋：/**/ 一般用在函數(shù)或者一段代碼上

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

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

• number（數(shù)字類型：整數(shù)和小數(shù)）

• string（字符串類型）

• boolean （布爾類型）

• null （空類型）

  值只有一個(gè)：null，一個(gè)對(duì)象指向?yàn)榭?/p>

• undefined （未定義）

  值只有一個(gè)：undefined酪我，

  如果聲明了變量但是沒(méi)有賦值的情況下就會(huì)是undefined

• object （對(duì)象）

獲取變量的數(shù)據(jù)類型

• typeof 變量名

• typeof(變量名)

  var num = 10
  console.log(typeof(num))
  console.log(typeof num)
  

數(shù)字類型

整數(shù)和小數(shù)

JS中可以表示

八進(jìn)制：0開(kāi)頭

十進(jìn)制

十六進(jìn)制：0x開(kāi)頭

數(shù)字類型有范圍

最大值 Number.MAX_VALUE

最小值 Number.MIN_VALUE

數(shù)值判斷

NaN:not a number

isNaN:is not a number

注意

不要用小數(shù)去驗(yàn)證小數(shù)

不要用NaN驗(yàn)證是不是NaN （使用isNaN()）

字符串類型

獲取字符串長(zhǎng)度：

• .length（包括空格）

JS中的轉(zhuǎn)義符：

字符串拼接

使用‘+’號(hào)消痛，將多個(gè)字符串拼為一個(gè)

一個(gè)字符串和其他數(shù)字拼接，最終結(jié)果是字符串

數(shù)字類型的字符串和一個(gè)數(shù)字類型的數(shù)字相加得到的是數(shù)字類型的數(shù)字（發(fā)生了隱式轉(zhuǎn)換）

布爾類型

只有兩個(gè)值都哭，true & false

類型轉(zhuǎn)換

其他類型轉(zhuǎn)數(shù)字類型

• parseInt() 轉(zhuǎn)整數(shù)
• parseFloat() 轉(zhuǎn)小數(shù)
• Number() 轉(zhuǎn)數(shù)字 （包括整數(shù)和小數(shù)）

其他類型轉(zhuǎn)字符串類型

• .toString() 變量有意義

• String() 變量沒(méi)有意義

  var num = 10
  console.log(num.toString())
  console.log(String(num))
  

其他類型轉(zhuǎn)布爾類型

Boolean()

console.log(Boolean(1)) // true

console.log(Boolean(0)) //false

操作符

含義：一些符號(hào)秩伞，用來(lái)計(jì)算

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

• /
• %

一元運(yùn)算符

這個(gè)操作符只需要一個(gè)操作數(shù)就可以運(yùn)算的符號(hào)

• ++

  • 前++ 前--

    先參與運(yùn)算，運(yùn)算結(jié)束后再加1

    num++ +10 num的值為10

  • 后++ 后--

    自身先加1欺矫，然后再參與運(yùn)算

    ++num +10 num的值為11

• --

二元運(yùn)算符

類似于算數(shù)運(yùn)算符

需要兩個(gè)操作數(shù)才能運(yùn)算

三元運(yùn)算符

表達(dá)式1 > 表達(dá)式2 纱新？表達(dá)式3 ：表達(dá)式4

符合運(yùn)算符

由復(fù)合運(yùn)算符連接起來(lái)的表達(dá)式

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

關(guān)系運(yùn)算符

結(jié)果是布爾類型

• ">"
• "<"
• ">="
• "<="
• "=="（不嚴(yán)格）（數(shù)據(jù)類型不用一致）
• "==="（嚴(yán)格）（數(shù)據(jù)類型必須一致）
• "!="
• "!=="

邏輯運(yùn)算符

結(jié)果是布爾類型

• &&（并且）
• ||（或者）
• ！（非）

賦值運(yùn)算符

=

字面量

把一個(gè)值直接賦值給一個(gè)變量

變量的初始化就是以字面量的方式賦值

var num = 10
var flag = true
var str = 'haha'

//以上方式都叫字面量

流程控制

• 順序結(jié)構(gòu)
• 分支結(jié)構(gòu)
  • if
  • if-else
  • if-else if-else.......（最后的else可以不用寫(xiě)）（一般是范圍的判斷）
  • switch-case（default后面的break可以省略）（一般是值得判斷）
  • 三元表達(dá)式
    • 兩個(gè)分支穆趴，最終的結(jié)果是其中之一
    • 運(yùn)算符號(hào)： 脸爱？ ：
    • 大多數(shù)情況，使用if-else的語(yǔ)句都可以使用三元表達(dá)式
• 循環(huán)結(jié)構(gòu)
  • while （先判斷后循環(huán)未妹，可能一次循環(huán)都沒(méi)有）
  • do-while（先循環(huán)一次簿废，再判斷，最少有一次循環(huán)）
  • for
  • for-in

關(guān)鍵字

break

如果在循環(huán)中使用络它，遇到了break族檬，則立刻跳出當(dāng)前所在循環(huán)

continue

在循環(huán)中如果遇到了continue關(guān)鍵字，直接開(kāi)始下一次循環(huán)

數(shù)組

概念化戳、作用

• 一組有序的數(shù)據(jù)
• 可以一次性存儲(chǔ)多個(gè)數(shù)據(jù)

創(chuàng)建方式

• 構(gòu)造函數(shù)
  • var 數(shù)組名 = new Array() //空數(shù)組
  • 數(shù)組的名字如果直接輸出,那么直接就可以把數(shù)組中的數(shù)據(jù)顯示出來(lái),如果沒(méi)有數(shù)據(jù),就看不到數(shù)據(jù)
  • 如果數(shù)組中沒(méi)有數(shù)據(jù),但是有長(zhǎng)度---,數(shù)組中的每個(gè)值就是undefined
  • 構(gòu)造函數(shù)的方式創(chuàng)建數(shù)組的時(shí)候,如果在Array(一個(gè)數(shù)字)--->數(shù)組的長(zhǎng)度(數(shù)組元素的個(gè)數(shù)) var num = new Arrey(5) //表示這個(gè)數(shù)組的長(zhǎng)度為5单料，有5個(gè)元素，每個(gè)數(shù)據(jù)是undefined
  • 如果在Array(多個(gè)值);這個(gè)數(shù)組中就有數(shù)據(jù)了,數(shù)組的長(zhǎng)度就是這些數(shù)據(jù)的個(gè)數(shù)
• 字面量
  • var 數(shù)組名 = [] //空數(shù)組
  • 無(wú)論是構(gòu)造函數(shù)的方式還是字面量的方式,定義的數(shù)組,如果有長(zhǎng)度,那么默認(rèn)是undefined

數(shù)組元素

數(shù)組中存儲(chǔ)的每個(gè)數(shù)據(jù),都可以叫數(shù)組的元素,比如:存儲(chǔ)了3個(gè)數(shù)據(jù),數(shù)組中3個(gè)元素

數(shù)組長(zhǎng)度

就是數(shù)組的元素的個(gè)數(shù),比如有3個(gè)元素,就說(shuō),這個(gè)數(shù)組的長(zhǎng)度是3

數(shù)組索引（下標(biāo)）

數(shù)組索引(下標(biāo)):用來(lái)存儲(chǔ)或者訪問(wèn)數(shù)組中的數(shù)據(jù)的,索引從0開(kāi)始,到長(zhǎng)度減1結(jié)束

數(shù)組的索引和數(shù)組的長(zhǎng)度的關(guān)系

數(shù)組長(zhǎng)度減1就是最大的索引值

設(shè)置數(shù)組中某個(gè)位置的值

arr[3] = 100 //arr數(shù)組中索引為3的位置值為100

獲取數(shù)組中某個(gè)位置的值

var result = arr[3];

console.log(result)

數(shù)組中儲(chǔ)存的類型可以不一樣

• 例1.數(shù)組的函數(shù)調(diào)用

var arr = [
        function () {
            console.log("eat")
        },
        function () {
            console.log("sleep")
        },
        function () {
            console.log("play")
        },
        function () {
            console.log("drink")
        },
    ];

    arr.forEach(function (ele) {
        ele();
    })

冒泡排序

把所有的數(shù)據(jù)按照一定的順序進(jìn)行排列（從小到大点楼，從大到猩狻）

函數(shù)

把一坨重復(fù)的代碼封裝，在需要的時(shí)候直接調(diào)用即可

作用：代碼重復(fù)調(diào)用

定義：function 函數(shù)名字（） {
        函數(shù)體
}

調(diào)用：函數(shù)名（）

注意：

• 函數(shù)需要先定義掠廓，然后才能使用
• 函數(shù)的名字：要遵循駝峰命名法
• 函數(shù)一旦重名藏斩，后面的會(huì)把前面的覆蓋
• 一個(gè)函數(shù)最好就是只有一個(gè)功能

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

• 在函數(shù)定義的時(shí)候,函數(shù)名字后面的小括號(hào)里的變量就是參數(shù),目的是函數(shù)在調(diào)用的時(shí)候,對(duì)用戶傳進(jìn)來(lái)的值操作，此時(shí)函數(shù)定義的時(shí)候后面的小括號(hào)里的變量叫參數(shù);寫(xiě)了兩個(gè)變量,就有兩個(gè)參數(shù),
• 在函數(shù)調(diào)用的時(shí)候,按照提示的方式,給變量賦值--->就叫傳值,這個(gè)值就傳到了變量(參數(shù))中
• 形參:函數(shù)在定義的時(shí)候小括號(hào)里的變量叫形參
• 實(shí)參:函數(shù)在調(diào)用的時(shí)候小括號(hào)里傳入的值叫實(shí)參,實(shí)參可以是變量也可以是值

函數(shù)的返回值

• 在函數(shù)內(nèi)部有return關(guān)鍵字,并且在關(guān)鍵字后面有內(nèi)容,這個(gè)內(nèi)容被返回了
• 當(dāng)函數(shù)調(diào)用之后,需要這個(gè)返回值,那么就定義變量接收,即可
• 如果一個(gè)函數(shù)中有return却盘，那么這個(gè)函數(shù)就有返回值狰域，如果一個(gè)函數(shù)中沒(méi)有return,那么這個(gè)函數(shù)就沒(méi)有返回值
• 如果一個(gè)函數(shù)中沒(méi)有明確的返回值,那么調(diào)用的時(shí)候接收了,結(jié)果就是undefined
  • 沒(méi)有明確返回值:
    • 函數(shù)中沒(méi)有return
    • 函數(shù)中有return,但是return后面沒(méi)有任何內(nèi)容
• 形參的個(gè)數(shù)和實(shí)參的個(gè)數(shù)可以不一致
• return 下面的代碼是不會(huì)執(zhí)行的

arguments對(duì)象

定義一個(gè)函數(shù)，如果不確定用戶是否傳入了參數(shù)黄橘，或者說(shuō)不知道用戶傳入了幾個(gè)參數(shù)兆览，沒(méi)辦法計(jì)算

但是，如果在函數(shù)中知道了參數(shù)的個(gè)數(shù)塞关，也知道了每個(gè)參數(shù)的值抬探，就可以計(jì)算，怎么辦呢帆赢？

使用arguments對(duì)象小压，可以獲取傳入的每個(gè)參數(shù)的值

arguments對(duì)象也可以叫做偽數(shù)組

函數(shù)的命名方式

• 命名函數(shù)
  • 函數(shù)有名字
• 匿名函數(shù)
  • 函數(shù)沒(méi)有名字

函數(shù)的定義

• 聲明函數(shù)——函數(shù)定義

  • function 函數(shù)名 （）｛｝

• 函數(shù)表達(dá)式

  • 把一個(gè)函數(shù)給一個(gè)變量

    var f1 = function(){}

  • 如果是函數(shù)表達(dá)式，那么前面的變量中存儲(chǔ)的就是一個(gè)函數(shù)椰于，而這個(gè)變量就相當(dāng)于是一個(gè)函數(shù)怠益，就可以直接加小括號(hào)用

  • 注意：函數(shù)表達(dá)式，賦值結(jié)束后瘾婿，要加分號(hào)

  • 注意：函數(shù)聲明如果放在if-else的語(yǔ)句中,在IE8的瀏覽器中會(huì)出現(xiàn)問(wèn)題蜻牢，以后寧愿用函數(shù)表達(dá)式,都不用函數(shù)聲明

   if(true){
     function f1() {
       console.log("哈哈,我又變帥了");
     }
   }else{
     function f1() {
       console.log("小蘇好猥瑣");
     }
   }
   f1();//在IE8中輸出`小蘇好猥瑣`

var ff;
    if(true){
      ff=function () {
        console.log("哈哈,我又變帥了");
      };
    }else{
      ff=function () {
        console.log("小蘇好猥瑣");
      };
    }
    ff();

• 函數(shù)自調(diào)用

  • 沒(méi)有名字，直接調(diào)用偏陪，一次性

  函數(shù)也是一種數(shù)據(jù)類型

  可以通過(guò)typeof查看

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

函數(shù)作為參數(shù)使用

函數(shù)可以作為參數(shù)使用抢呆，如果一個(gè)函數(shù)作為參數(shù)，那么我們說(shuō)這個(gè)參數(shù)（函數(shù)）叫回調(diào)函數(shù)

只要是看到了一個(gè)函數(shù)作為參數(shù)使用了笛谦，那就是回調(diào)函數(shù)

函數(shù)作為返回值使用

function f1() {
    console.log("this is a function ");
    return function () {
        console.log("this is another function");
    }
}

var ff = f1();  // "this is a function "
ff()    // "this is another function"

函數(shù)的作用域

• 全局變量
  • 聲明的變量使用var聲明的
  • 全局變量可以在頁(yè)面的任何位置使用
  • 除了函數(shù)以外抱虐，其他任何位置定義的變量都是全局變量
  • 如果頁(yè)面不關(guān)閉，那么就不會(huì)釋放饥脑，就會(huì)占空間恳邀，消耗內(nèi)存
• 局部變量
  • 在函數(shù)內(nèi)部定義的變量
• 隱式全局變量：
  • 聲明的變量沒(méi)有var
  • 可以被刪除（全局變量則不可以）delete

• 全局作用域
  • 全局變量的使用范圍
• 局部作用域
  • 局部變量的使用范圍
• 塊級(jí)作用域
  • 一對(duì)大括號(hào)就可以看成是一塊，在這塊區(qū)域中應(yīng)以的變量好啰，只能在這個(gè)區(qū)域中使用轩娶，但是在js中在這個(gè)塊級(jí)作用域中定義的變量，外面也能使用
  • js沒(méi)有塊級(jí)作用域

預(yù)解析

提前解析代碼

• 把變量的聲明提前
• 把函數(shù)的聲明提前
• -提前到當(dāng)前所在作用域的最上面
• 注意：變量的提升框往，只會(huì)在當(dāng)前的作用域中提升鳄抒，函數(shù)中的變量只能提升到當(dāng)前作用域的最前面，不會(huì)出去
• 預(yù)解析會(huì)分段（多對(duì)<script>標(biāo)簽中的函數(shù)重名椰弊。預(yù)解析的時(shí)候不會(huì)發(fā)生沖突）

this指向

• 普通函數(shù)中的this是誰(shuí)?-----window
• 對(duì)象.方法中的this是誰(shuí)?----當(dāng)前的實(shí)例對(duì)象
• 定時(shí)器方法中的this是誰(shuí)?----window
• 構(gòu)造函數(shù)中的this是誰(shuí)?-----實(shí)例對(duì)象
• 原型對(duì)象方法中的this是誰(shuí)?---實(shí)例對(duì)象

面向?qū)ο?/h2>

編程思想

根據(jù)需求,分析對(duì)象,找到對(duì)象有什么特征和行為,通過(guò)代碼的方式來(lái)實(shí)現(xiàn)需求,要想實(shí)現(xiàn)這個(gè)需求,就要?jiǎng)?chuàng)建對(duì)象,要想創(chuàng)建對(duì)象,就應(yīng)該顯示有構(gòu)造函數(shù),然后通過(guò)構(gòu)造函數(shù)來(lái)創(chuàng)建對(duì)象.,通過(guò)對(duì)象調(diào)用屬性和方法來(lái)實(shí)現(xiàn)相應(yīng)的功能及需求

為什么要使用面向?qū)ο缶幊?/h3>

首先JS不是一門(mén)面向?qū)ο蟮恼Z(yǔ)言,JS是一門(mén)基于對(duì)象的語(yǔ)言,那么為什么學(xué)習(xí)js還要學(xué)習(xí)面向?qū)ο?因?yàn)槊嫦驅(qū)ο蟮乃枷?strong>適合于人的想法,編程起來(lái)會(huì)更加的方便,及后期的維護(hù)

在JS中如何使用面向?qū)ο缶幊?/h3>

面向?qū)ο蟮木幊陶Z(yǔ)言中有類(class)的概念(也是一種特殊的數(shù)據(jù)類型),但是JS不是面向?qū)ο蟮恼Z(yǔ)言,所以,JS中沒(méi)有類(class),但是JS可以模擬面向?qū)ο蟮乃枷刖幊?/strong>,JS中會(huì)通過(guò)構(gòu)造函數(shù)來(lái)模擬類的概念(class)

特征

封裝

• 一個(gè)值存儲(chǔ)在變量中
• 一坨重復(fù)的代碼放在一個(gè)函數(shù)中
• 一系列的屬性放在一個(gè)對(duì)象中
• 一些功能類似的函數(shù)(方法)放在一個(gè)對(duì)象中
• 好多相類似的對(duì)象放在一個(gè)js文件中

繼承

• 首先繼承是一種關(guān)系,類(class)與類之間的關(guān)系,JS中沒(méi)有類,但是可以通過(guò)構(gòu)造函數(shù)模擬類,然后通過(guò)原型來(lái)實(shí)現(xiàn)繼承
• 繼承也是為了數(shù)據(jù)共享,js中的繼承也是為了實(shí)現(xiàn)數(shù)據(jù)共享

多態(tài)

• 一個(gè)對(duì)象有不同的行為,或者是同一個(gè)行為針對(duì)不同的對(duì)象,產(chǎn)生不同的結(jié)果,要想有多態(tài),就要先有繼承,js中可以模擬多態(tài),但是不會(huì)去使用,也不會(huì)模擬

萬(wàn)物皆對(duì)象

• 什么是對(duì)象许溅？

  有屬性和方法，具體特指的某個(gè)事物

  一組無(wú)序?qū)傩缘募系逆I值對(duì)秉版，屬性的值可以是任意的類型

• 對(duì)象的特點(diǎn)：

  有特征

  有行為

創(chuàng)建對(duì)象的方式

• 1.調(diào)用系統(tǒng)的構(gòu)造函數(shù)創(chuàng)建對(duì)象

   var person = new Object();
      person.name = 'cysky';
      person.age = 22;
      person.eat = function () {
          console.log("我餓了贤重，我要吃東西")
      };
  
      person.eat();
      console.log(person.name)
  

• 2.自定義構(gòu)造函數(shù)創(chuàng)建對(duì)象

   function Person (name,age,sex) {
          this.name = name;
          this.age = age;
          this.sex = sex;
          this.eat = function () {
              console.log("我餓了，我要吃東西")
          };
      }
  
      var hu = new Person('cysky', 22 , 'male');//創(chuàng)建對(duì)象————實(shí)例化一個(gè)對(duì)象清焕，同時(shí)對(duì)屬性初始化
      console.log(hu.name);
      hu.eat()
  

  • 構(gòu)造函數(shù)與函數(shù)的區(qū)別
    • 名字是不是大寫(xiě)（首字母）
  • 自定義構(gòu)造函數(shù)創(chuàng)建對(duì)象
    • 先自定義一個(gè)構(gòu)造函數(shù)并蝗，再創(chuàng)建對(duì)象
  • 自定義構(gòu)造函數(shù)的步驟
    • 在內(nèi)存中申請(qǐng)一塊空閑空間
    • 把this設(shè)置為當(dāng)前的對(duì)象
    • 設(shè)置對(duì)象的屬性和方法的值
    • 把this這個(gè)對(duì)象返回

• 3.字面量的方式創(chuàng)建對(duì)象

  //字面量方式創(chuàng)建對(duì)象
          //一般寫(xiě)法
      var person = {};
      person.name = 'cysky';
      person.age= 22;
      person.eat = function () {
        console.log("我餓了祭犯，我要吃東西")
      };
  
          //簡(jiǎn)寫(xiě)方式
      var person = {
          name:'cysky',
          age:20,
          eat:function(){
              console.log("我餓了，要吃東西")
          }
      };
  
      console.log(person.name);
      person.eat()
  

  • 缺點(diǎn)：一次性函數(shù)

• 4.工廠模式創(chuàng)建對(duì)象

   function person(name,age,sex){
          var obj = {};
          obj.name = name;
          obj.age = age;
          obj.sex = sex;
          obj.eat = function () {
              console.log("我餓了滚停，我要吃東西")
          };
          return obj;
      }
  
      var hu = person('cysky',20,'male');
      hu.eat();
      console.log(hu.name)
  

  工廠模式創(chuàng)建對(duì)象與自定義和構(gòu)造函數(shù)創(chuàng)建對(duì)象的差別：

  • 函數(shù)名小寫(xiě)
  • 有new 有return
  • 直接調(diào)用函數(shù)就可以創(chuàng)建對(duì)象

如何獲取該對(duì)象（變量）

• instanceof——值是布爾類型

Json數(shù)據(jù)格式

一般都是成對(duì)沃粗，鍵值對(duì)

Json也是一個(gè)對(duì)象，一般Json合適的數(shù)據(jù)無(wú)論是鍵還是值都是用雙引號(hào)引起來(lái)

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

• 原始數(shù)據(jù)類型

    number
    
    string
    
    boolean
    
    undefined
    
    null
    
    object
  

• 基本類型（簡(jiǎn)單類型）键畴，值類型：number string boolean

  • 值類型之間傳遞最盅，傳遞的是值

• 復(fù)雜類型（引用類型）：object

  • 引用類型之間傳遞，傳遞的是地址（引用）

• 空類型：undefined null

內(nèi)置對(duì)象

JS中有三中對(duì)象：

• 內(nèi)置對(duì)象——JS系統(tǒng)自帶
  • Math
    • Math.PI
    • Math.E
    • Math.abs()
    • Math.ceil()——向上取整
    • Math.floor()——向下取整
  • Date
    • var dt = new Date();
    • console.log(dt.getFullYear());——獲取年份
    • console.log(dt.getMonth()+1);——獲取月份（從0開(kāi)始）
    • console.log(dt.getDate());——獲取日期
    • console.log(dt.getHours());——獲取小時(shí)
    • console.log(dt.getMinutes());——獲取分鐘
    • console.log(dt.getSeconds());——獲取秒
    • console.log(dt.getDay());——獲取星期（星期日是0）
    • console.log(dt.toDateString());——英文的日期
    • console.log(toLocaleDateString());——數(shù)字格式日期
    • console.log(dt.toTimeString())——小時(shí)分鐘秒
    • console.log(dt.toLocalTimeString())——小時(shí)分鐘秒
    • console.log(dt.valueOf());——毫秒值（從1971年開(kāi)始計(jì)算）
    • console.log(dt.toString())——轉(zhuǎn)成字符串
  • String
    • 字符串可以看成是字符組成的數(shù)組起惕，但是JS中沒(méi)有字符類型
    • 字符是一個(gè)一個(gè)的涡贱，在別的語(yǔ)言中，字符用一對(duì)單引號(hào)括起來(lái)
    • 在JS中字符串可以使用單引號(hào)也可以使用雙引號(hào)惹想，因?yàn)樽址梢钥闯墒且粋€(gè)數(shù)組问词，所以，可通過(guò)for循環(huán)進(jìn)行遍歷
    • 字符串特性：不可變性勺馆，字符串的值是不能改變的
    • 字符串的值看起來(lái)是改變了戏售，其實(shí)是指向改變了
    • 字符串可通過(guò)索引的方式訪問(wèn)字符串（只讀）
    • .length——字符串的長(zhǎng)度
    • .charAt(索引)——返回值是指定索引位置的字符串，超出索引返回空字符串
    • .fromCharCode(數(shù)字值草穆，可以是多個(gè)參數(shù))——返回的是ASCII碼對(duì)應(yīng)的值
    • .concat(字符串1灌灾，字符串2......)——返回的是拼接之后的字符串
    • .indexOf(要找的字符串，從某個(gè)位置開(kāi)始的索引)——返回的是這個(gè)字符串的索引值悲柱，沒(méi)找到則返回-1
    • .lastIndexOf(要找的字符串)——從后向前找,但是索引仍然是從左向右的方式,找不到則返回-1
    • .replace("原來(lái)的字符串","新的字符串")——用來(lái)替換字符串的
    • .slice(開(kāi)始的索引,結(jié)束的索引)——從索引5的位置開(kāi)始提取,到索引為10的前一個(gè)結(jié)束,沒(méi)有10锋喜，并返回這個(gè)提取后的字符串
    • .split("要干掉的字符串",切割后留下的個(gè)數(shù))——切割字符串
    • .substr(開(kāi)始的位置,個(gè)數(shù))——返回的是截取后的新的字符串
    • .substring(開(kāi)始的索引,結(jié)束的索引)——返回截取后的字符串,不包含結(jié)束的索引的字符串
    • .toLocaleLowerCase()——轉(zhuǎn)小寫(xiě)
    • toLowerCase()——轉(zhuǎn)小寫(xiě)
    • toLocaleUpperCase()——轉(zhuǎn)大寫(xiě)
    • toUpperCase()——轉(zhuǎn)大寫(xiě)
    • trim()——干掉字符串兩端的空格
  • Array
    • .isArray()——判斷這個(gè)對(duì)象是不是數(shù)組
    • .conact(數(shù)組,數(shù)組,數(shù)組,...)——組合一個(gè)新的數(shù)組
    • .every(函數(shù))——返回值是布爾類型,函數(shù)作為參數(shù)使用,函數(shù)中有三個(gè)參數(shù),第一個(gè)參數(shù)是元素的值，第二個(gè)參數(shù)是索引值,第三個(gè)參數(shù)是原來(lái)的數(shù)組(沒(méi)用)豌鸡，如果這個(gè)數(shù)組中的每個(gè)元素的值都符合條件,最后才返回的是true
    • .filter(函數(shù))——返回的是數(shù)組中每一個(gè)元素都復(fù)合條件的元素,組成了一個(gè)新的數(shù)組
    • .push(值)——把值追加到數(shù)組中,加到最后了---返回值也是追加數(shù)據(jù)之后的數(shù)組長(zhǎng)度
    • .pop()——?jiǎng)h除數(shù)組中最后一個(gè)元素,返回值就是刪除的這個(gè)值
    • .shift()——?jiǎng)h除數(shù)組中第一個(gè)元素,返回值就是刪除的這個(gè)值
    • .unshift()——向數(shù)組的第一個(gè)元素前面插入一個(gè)新的元素,----返回值是插入后的新數(shù)組
    • .forEach(函數(shù))——遍歷數(shù)組用---相當(dāng)于for循環(huán)
    • .indexOf(元素值)——返回的是索引,沒(méi)有則是-1
    • .join("字符串")——返回的是一個(gè)字符串
    • .map(函數(shù))——數(shù)組中的每個(gè)元素都要執(zhí)行這個(gè)函數(shù),把執(zhí)行后的結(jié)果重新的全部的放在一個(gè)新的數(shù)組中
    • .reverse()——反轉(zhuǎn)數(shù)組
    • .sort()——排序的,可能不穩(wěn)定,如果不穩(wěn)定,請(qǐng)寫(xiě)MDN中的那個(gè)固定的代碼
    • .arr.slice(開(kāi)始的索引,結(jié)束的索引)——把截取的數(shù)組的值放在一個(gè)新的數(shù)組中,但是不包含結(jié)束的索引對(duì)應(yīng)的元素值
    • .splice(開(kāi)始的位置,要?jiǎng)h除的個(gè)數(shù),替換的元素的值)——一般是用于刪除數(shù)組中的元素,或者是替換元素,或者是插入元素
  • Object
• 自定義對(duì)象——自己定義的構(gòu)造函數(shù)創(chuàng)建的對(duì)象
• 瀏覽器對(duì)象——BOM

基本包裝類型

普通變量不能直接調(diào)用屬性或者方法

對(duì)象可以直接調(diào)用屬性和方法

基本包裝類型:本身是基本類型,但是在執(zhí)行代碼的過(guò)程中,如果這種類型的變量調(diào)用了屬性或者是方法,那么這種類型就不再是基本類型了,而是基本包裝類型,這個(gè)變量也不是普通的變量了,而是基本包裝類型對(duì)象

原型

作用

• 數(shù)據(jù)共享,節(jié)省內(nèi)存空間
• 為了實(shí)現(xiàn)繼承

構(gòu)造函數(shù)和實(shí)例對(duì)象之間的關(guān)系

• 實(shí)例對(duì)象是通過(guò)構(gòu)造函數(shù)來(lái)創(chuàng)建的嘿般，創(chuàng)建的過(guò)程叫實(shí)例化

        //創(chuàng)建構(gòu)造函數(shù)
function Person(name,age,sex){
        this.name = name;
        this.age = age;
        this.sex = sex;
        this.eat = function () {
            console.log("我餓了，我要吃東西")
        }
    }
        //實(shí)例化一個(gè)對(duì)象
    var hu = new Person('cysky',20,'male');
    console.dir(hu);//實(shí)例對(duì)象
    console.dir(Person);//構(gòu)造函數(shù)的名字
    
    console.log(hu.constructor===Person);//實(shí)例對(duì)象的構(gòu)造器是指向Person的,結(jié)果是true,所以,這個(gè)實(shí)例對(duì)象hu就是通過(guò)Person來(lái)創(chuàng)建的

構(gòu)造函數(shù)創(chuàng)建對(duì)象帶來(lái)的問(wèn)題--原型使用的原因

調(diào)用同樣的方法卻會(huì)創(chuàng)建不同的對(duì)象涯冠，消耗內(nèi)存

   function Person(name, age) {
        this.name = name;
        this.age = age;
        this.eat = function myEat() {
            console.log("吃桂花糕");
        };
    }

    var per1 = new Person("小白", 5);
    var per2 = new Person("小黑", 6);

    console.dir(per1);
    console.dir(per2);
    console.log(per1.eat === per2.eat);//false——?jiǎng)?chuàng)建了不同的對(duì)象

解決辦法：

 function myEat() {
        console.log("我要吃桂花糕")
    }

    function Person(name,age){
        this.name = name;
        this.age = age;
        this.eat = myEat;//將這個(gè)方法作為公用方法
    }

    var per1 = new Person('小白', 5);
    var per2 = new Person('小黑', 6);
    console.log(per1.eat === per2.eat);//true——調(diào)用的是同一方法

引入原型：

通過(guò)原型來(lái)解決---------數(shù)據(jù)共享,節(jié)省內(nèi)存空間

 function Person(name, age){
        this.name = name;
        this.age = age;
    }

    Person.prototype.eat = function () {
        console.log("我餓了炉奴，我要吃東西")
    };//通過(guò)構(gòu)造函數(shù)的原型添加一個(gè)方法

    var per1 = new Person('小黑',20);
    var per2 = new Person('小白',22);

    console.log(per1.eat === per2.eat)//true——調(diào)用同一方法

原型的簡(jiǎn)單語(yǔ)法

function Person(name,age,sex){
        this.name = name;
        this.age = age;
        this.sex = sex;
    }

    Person.prototype = {
        //**手動(dòng)修改構(gòu)造器指向**
        constructor:Person,
        hieght:180,
        weight:"80kg",
        eat:function(){
            console.log("大家都有飯吃")
        },
        play:function(){
            console.log("一起玩游戲")
        }
    };

    var per1 = new Person('小黑',20,"male");

    console.log(per1.hieght);
    console.log(per1.name);
    per1.play()

原型總結(jié)

• 實(shí)例對(duì)象中有proto這個(gè)屬性,叫原型,它是一個(gè)對(duì)象,這個(gè)屬性是給瀏覽器使用,不是標(biāo)準(zhǔn)的屬性----->proto----->可以叫原型對(duì)象
• 構(gòu)造函數(shù)中有prototype這個(gè)屬性,叫原型,也是一個(gè)對(duì)象,這個(gè)屬性是給程序員使用,是標(biāo)準(zhǔn)的屬性------>prototype--->也可以叫原型對(duì)象
• 實(shí)例對(duì)象的proto和構(gòu)造函數(shù)中的prototype相等
• 又因?yàn)閷?shí)例對(duì)象是通過(guò)構(gòu)造函數(shù)來(lái)創(chuàng)建的,構(gòu)造函數(shù)中有原型對(duì)象prototype， 實(shí)例對(duì)象的proto指向了構(gòu)造函數(shù)的原型對(duì)象prototype

構(gòu)造函數(shù)蛇更、實(shí)例對(duì)象瞻赶、原型對(duì)象三者之間的關(guān)系

• 構(gòu)造函數(shù)可以實(shí)例化對(duì)象
• 構(gòu)造函數(shù)中有一個(gè)屬性叫prototype,是構(gòu)造函數(shù)的原型對(duì)象
• 構(gòu)造函數(shù)的原型對(duì)象(prototype)中有一個(gè)constructor構(gòu)造器,這個(gè)構(gòu)造器指向的就是自己所在的原型對(duì)象所在的構(gòu)造函數(shù)
• 實(shí)例對(duì)象的原型對(duì)象(proto)指向的是該構(gòu)造函數(shù)的原型對(duì)象
• 構(gòu)造函數(shù)的原型對(duì)象(prototype)中的方法是可以被實(shí)例對(duì)象直接訪問(wèn)的

利用原型共享數(shù)據(jù)

• 什么樣的數(shù)據(jù)需要寫(xiě)在原型中
  • 需要共享的數(shù)據(jù)
• 原型中可以共享那些數(shù)據(jù)？
  • 屬性
  • 方法

function Student(name, age, sex) {
        this.name = name;
        this.age = age;
        this.sex = sex;
    }

    Student.prototype.eat = function () {
        console.log("今天中午吃外賣(mài)")
    };//在Student原型中添加方法
    Student.prototype.weight = "55kg";//在Student原型中添加屬性

    var per1 = new Student("小黑", 20, "male");//實(shí)例化一個(gè)對(duì)象
    var per2 = new Student("小白", 22, "female");

    console.log(per1.eat === per2.eat);//true
    console.log(per1.weight);
    console.log(per2.weight);
    console.log(per1.name);
    console.log(per2.name)

相互訪問(wèn)原型中的方法

function Animal(name,age){
        this.name = name;
        this.age = age;
    }

    Animal.prototype.eat = function () {
        console.log("我要吃飯啦");
        this.play()
    };
    Animal.prototype.play = function () {
        console.log("主人陪我玩");
        this.sleep()
    };
    Animal.prototype.sleep = function () {
        console.log("我要睡覺(jué)啦")
    };

    var dog = new Animal("小花",3);
    dog.eat()//我要吃飯啦 主人陪我玩 我要睡覺(jué)啦

實(shí)例對(duì)象使用屬性和方法層層搜索

• 實(shí)例對(duì)象使用的屬性或者方法,先在實(shí)例中查找,找到了則直接使用,找不到則,去實(shí)例對(duì)象的proto指向的原型對(duì)象prototype中找,找到了則使用,找不到則報(bào)錯(cuò)

 function Person(name, age) {
        this.name = name;
        this.age = age;
        this.eat = function () {
            console.log("我還不餓派任，不想吃東西")
        }
    }

    Person.prototype.sex = 'male';
    Person.prototype.eat = function () {
        console.log("我餓了砸逊，我要吃東西")
    };

    var per1 = new Person("cysky", 22);

    per1.eat();//優(yōu)先輸出實(shí)例對(duì)象中有的屬性和方法
    console.log(per1.sex)//實(shí)例對(duì)象中沒(méi)有的屬性會(huì)在原型里去找

為內(nèi)置對(duì)象添加原型和方法

• 相當(dāng)于在改變?cè)创a

    //反轉(zhuǎn)字符串
    String.prototype.myReverse = function () {
        for(var i = this.length-1;i>=0;i--){
            console.log(this[i])
        }
    };
    var str = "abcdefg";
    str.myReverse();

將局部變量變成全局變量

• 把局部變量給window就可以了（運(yùn)用函數(shù)的自調(diào)用）

(function (形參) {
    var num=10;//局部變量
  })(實(shí)參);
    console.log(num);

   (function (window) {
     var num=10;//局部變量
     //js是一門(mén)動(dòng)態(tài)類型的語(yǔ)言,對(duì)象沒(méi)有屬性,點(diǎn)了就有了
     window.num=num;
   })(window);
   console.log(num);

原型鏈

• 是一種關(guān)系，是實(shí)例對(duì)象和原型對(duì)象之間的關(guān)系掌逛，是通過(guò)原型("proto")來(lái)聯(lián)系的

使用對(duì)象就要先有構(gòu)造函數(shù)

如果有公用的屬性和方法师逸，使用原型

實(shí)例化對(duì)象,并初始化

• 實(shí)例對(duì)象中的原型proto（瀏覽器用）和構(gòu)造函數(shù)的原型prototype（程序員用）指向相同
• 實(shí)例對(duì)象中的原型指向構(gòu)造函數(shù)中的原型
• 原型的指向是可以改變的

   function Person(age) {
        this.age = age;
    }//構(gòu)造函數(shù)
    
    Person.prototype.eat = function () {
        console.log("吃東西");
    };//原型
    
    function Student(sex){
        this.sex = sex;
    }
    
    Student.prototype.sayHi = function () {
        console.log("hello");
    };
    
    Student.prototype = new Person(10);

    var stu = new Student("男");
    stu.eat();
    stu.sayHi();//報(bào)錯(cuò)：因?yàn)楦淖兞嗽蛯?duì)象的指向

• this

• 構(gòu)造函數(shù)中的this是指實(shí)例對(duì)象

• 原型中的this也是指實(shí)例對(duì)象

 function Person(age){
        this.age = age;//構(gòu)造函數(shù)中的this
        console.log(this);
    }
    Person.prototype.eat = function () {
        console.log(this);//原型中的this
        console.log("吃飯了嗎");
    };

    var per = new Person(10);
    per.eat();
    console.log(per)//結(jié)果同構(gòu)造函數(shù)和原型中的this一樣

繼承

JS中通過(guò)原型來(lái)實(shí)現(xiàn)繼承

function Animal(name, weight) {
        this.name = name;
        this.weight = weight;
    }//動(dòng)物的構(gòu)造函數(shù)

    Animal.prototype.eat = function () {
        console.log("animal can eat")
    };//動(dòng)物原型

    function Dog(color){
        this.color = color;
    }//狗的構(gòu)造函數(shù)

    Dog.prototype = new Animal("哮天犬","50kg");//狗的原型指向改變

    Dog.prototype.bitePerson = function () {
        console.log("哼~汪汪~(yú)咬死你")
    };//先改變指向，再添加原型

    function ErHa(sex) {
        this.sex = sex;
    }//二哈構(gòu)造函數(shù)

    ErHa.prototype = new Dog('黑白色');//二哈原型

    ErHa.prototype.playHost = function () {
        console.log("哈哈~要壞衣服,要壞桌子,拆家..嘎嘎...好玩,開(kāi)心不,驚喜不,意外不")
    };

    var erha = new ErHa("雄性");

    console.log(erha.name,erha.weight,erha.color,erha.sex);

    erha.eat();
    erha.bitePerson();
    erha.playHost();

借用構(gòu)造函數(shù)

• 為了數(shù)據(jù)共享,改變?cè)椭赶?做到了繼承---通過(guò)改變?cè)椭赶驅(qū)崿F(xiàn)的繼承
• 缺陷:因?yàn)楦淖冊(cè)椭赶虻耐瑫r(shí)實(shí)現(xiàn)繼承,直接初始化了屬性豆混，繼承過(guò)來(lái)的屬性的值都是一樣的了,所以,這就是問(wèn)題篓像，只能重新調(diào)用對(duì)象的屬性進(jìn)行重新賦值动知。
• 解決方案:繼承的時(shí)候,不用改變?cè)偷闹赶?直接調(diào)用父級(jí)的構(gòu)造函數(shù)的方式來(lái)為屬性賦值就可以了------借用構(gòu)造函數(shù):把要繼承的父級(jí)的構(gòu)造函數(shù)拿過(guò)來(lái),使用一下就可以了
• call
  • 借用構(gòu)造函數(shù):構(gòu)造函數(shù)名字.call(當(dāng)前對(duì)象,屬性,屬性,屬性....);
  • 解決了屬性繼承,并且值不重復(fù)的問(wèn)題
  • 缺陷:父級(jí)類別中的方法不能繼承

  function Person(name, age, sex, weight) {
        this.name = name;
        this.age = age;
        this.sex = sex;
        this.weight = weight;
    }

    Person.prototype.sayHi = function () {
        console.log("您好")
    };

    function Student(name, age, sex, weight, score) {
        Person.call(this, name, age, sex, weight);
        this.score = score;
    }

    var stu1 = new Student("小明", 10, "男", "10kg", "100");
    var stu2 = new Student("小紅", 20, "女", "20kg", "120");

    console.log(stu1.name, stu1.age, stu1.sex, stu1.weight, stu1.score);
    console.log(stu2.name, stu2.age, stu2.sex, stu2.weight, stu2.score);

繼承組合

原型實(shí)現(xiàn)繼承
借用構(gòu)造函數(shù)實(shí)現(xiàn)繼承
組合繼承:原型繼承+借用構(gòu)造函數(shù)繼承

Person.prototype.sayHi = function () {
        console.log("hello")
    };

    function Student(name,age,sex,score){
        Person.call(this,name,age,sex);//使用call方法繼承屬性
        this.score = score;
    }

    Student.prototype = new Person();//使用原型繼承方法

    Student.prototype.eat = function () {
        console.log("eat something")
    };

    var stu = new Student("小黑",20,"男","100分");
    console.log(stu.name, stu.age, stu.sex, stu.score);

    stu.sayHi();
    stu.eat();

拷貝繼承

拷貝繼承；把一個(gè)對(duì)象中的屬性或者方法直接復(fù)制到另一個(gè)對(duì)象中

function Person() {

    }


    Person.prototype.age = 10;
    Person.prototype.sex = "male";
    Person.prototype.height = "180cm";
    Person.prototype.eat = function () {
        console.log('eat something');
    };

    var obj2 = {};//Person的構(gòu)造中有原型prototype,prototype就是一個(gè)對(duì)象,那么里面,age,sex,height,play都是該對(duì)象中的屬性或者方法

    for (var key in Person.prototype) {
        obj2[key] = Person.prototype[key];
    }

    console.dir(obj2);
    obj2.eat();

call&apply

作用：改變this的指向

 Person.prototype.sayHi = function (x, y) {
        console.log("你好呀：" + this.sex);
        return 1000;
    };

    var per = new Person(10, "男");
    per.sayHi();

    console.log(">>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>");

    function Student(name, sex) {
        this.name = name;
        this.sex = sex;
    }

    var stu = new Student("小明","人妖");
    var r1 = per.sayHi.apply(stu, [10,20]);//你好呀：人妖
    var r2 = per.sayHi.call(stu,10,20);//你好呀：人妖
    console.log(r1);//1000
    console.log(r2)//1000

區(qū)別：參數(shù)傳遞的方式是不一樣的

• apply的使用語(yǔ)法：
  • 函數(shù)名字.apply(對(duì)象,[參數(shù)1,參數(shù)2,...]);
  • 方法名字.apply(對(duì)象,[參數(shù)1,參數(shù)2,...]);
• call的使用語(yǔ)法：
  • 函數(shù)名字.call(對(duì)象,參數(shù)1,參數(shù)2,...);
  • 方法名字.call(對(duì)象,參數(shù)1,參數(shù)2,...);

只要是想使用別的對(duì)象的方法,并且希望這個(gè)方法是當(dāng)前對(duì)象的,那么就可以使用apply或者是call的方法改變this的指向

apply和call方法實(shí)際上并不在函數(shù)這個(gè)實(shí)例對(duì)象中,而是在Function的prototype中

    function f1() {
        console.log(this+":======>調(diào)用了");
    }
    //f1是函數(shù)遗淳，也是對(duì)象
    console.dir(f1);
    //對(duì)象調(diào)用方法拍柒，說(shuō)明該對(duì)象中有這個(gè)方法
    f1.apply();
    f1.call();
    
    console.log(f1.__proto__ === Function.prototype);
    //所有的函數(shù)都是Function的實(shí)例對(duì)象
    console.log(Function.prototype);
    //apply和call方法實(shí)際上并不在函數(shù)這個(gè)實(shí)例對(duì)象中,而是在Function的prototype中
    console.dir(Function);

bind

• bind方法是復(fù)制的意思,參數(shù)可以在復(fù)制的時(shí)候傳進(jìn)去,也可以在復(fù)制之后調(diào)用的時(shí)候傳入進(jìn)去
• apply和call是調(diào)用的時(shí)候改變this指向
• bind方法,是復(fù)制一份的時(shí)候,改變了this的指向
• 使用的語(yǔ)法
  • 函數(shù)名字.bind(對(duì)象,參數(shù)1,參數(shù)2,...);---->返回值是復(fù)制之后的這個(gè)函數(shù)
  • 方法名字.bind(對(duì)象,參數(shù)1,參數(shù)2,...);---->返回值是復(fù)制之后的這個(gè)方法

閉包

概念

? 函數(shù)A中，有一個(gè)函數(shù)B屈暗，函數(shù)B中可以訪問(wèn)函數(shù)A中定義的變量或者是數(shù)據(jù)，此時(shí)形成了閉包（不嚴(yán)謹(jǐn)）

閉包模式

? 函數(shù)模式

? 對(duì)象模式

作用

? 緩存數(shù)據(jù)脂男，延長(zhǎng)作用于鏈

缺點(diǎn)

? 緩存數(shù)據(jù)

總結(jié)

? 如果想要緩存數(shù)據(jù),就把這個(gè)數(shù)據(jù)放在外層的函數(shù)和里層的函數(shù)的中間位置

? 局部變量是在函數(shù)中,函數(shù)使用結(jié)束后,局部變量就會(huì)被自動(dòng)的釋放

? 閉包后,里面的局部變量的使用作用域鏈就會(huì)被延長(zhǎng)

function f2() {
        num = 10;
        return function () {
            num ++;
            return num;
        }
    }

    var ff = f2();
    console.log(ff());
    console.log(ff());
    console.log(ff());

//產(chǎn)生相同的隨機(jī)數(shù)
    function f1() {
        var num = parseInt(Math.random()*10+1);
        return function () {
            console.log(num)
        }
    }

    var ff = f1();
    ff();
    ff();
    ff();

遞歸

函數(shù)中調(diào)用函數(shù)自己,此時(shí)就是遞歸,遞歸一定要有結(jié)束的條件

//求n個(gè)數(shù)字的和,5 計(jì)算1+2+3+4+5
    var sum = 0;
    for (var i = 0; i <= 5; i++) {
        sum += i;
    }
    console.log(sum);

    function getSum(x){
        if(x===1){
            return 1
        }
        return x + getSum(x-1);
    }

    console.log(getSum(5))

拷貝

淺拷貝

? 拷貝就是復(fù)制,就相當(dāng)于把一個(gè)對(duì)象中的所有的內(nèi)容,復(fù)制一份給另一個(gè)對(duì)象,直接復(fù)制,或者說(shuō),就是把一個(gè)對(duì)象的地址給了另一個(gè)對(duì)象,他們指向相同,兩個(gè)對(duì)象之間有共同的屬性或者方法,都可以使用

 var obj1={
      age:10,
      sex:"男",
      car:["奔馳","寶馬","特斯拉","奧拓"]
    };
    
    var obj2={};
    
    function extend(a,b) {
      for(var key in a){
        b[key]=a[key];
      }
    }
    extend(obj1,obj2);
    console.dir(obj2);
    console.dir(obj1);
    

深拷貝

? 拷貝還是復(fù)制,深:把一個(gè)對(duì)象中所有的屬性或者方法,一個(gè)一個(gè)的找到.并且在另一個(gè)對(duì)象中開(kāi)辟相應(yīng)的空間,一個(gè)一個(gè)的存儲(chǔ)到另一個(gè)對(duì)象中

var obj1={
      age:10,
      sex:"男",
      car:["奔馳","寶馬","特斯拉","奧拓"],
      dog:{
        name:"大黃",
        age:5,
        color:"黑白色"
      }
    };

    var obj2={};//空對(duì)象
    //通過(guò)函數(shù)實(shí)現(xiàn),把對(duì)象a中的所有的數(shù)據(jù)深拷貝到對(duì)象b中
    function extend(a,b) {
      for(var key in a){
        //先獲取a對(duì)象中每個(gè)屬性的值
        var item=a[key];
        //判斷這個(gè)屬性的值是不是數(shù)組
        if(item instanceof Array){
          //如果是數(shù)組,那么在b對(duì)象中添加一個(gè)新的屬性,并且這個(gè)屬性值也是數(shù)組
          b[key]=[];
          //調(diào)用這個(gè)方法养叛，把a(bǔ)對(duì)象中這個(gè)數(shù)組的屬性值一個(gè)一個(gè)的復(fù)制到b對(duì)象的這個(gè)數(shù)組屬性中
          extend(item,b[key]);
        }else if(item instanceof Object){//判斷這個(gè)值是不是對(duì)象類型的
     //如果是對(duì)象類型的,那么在b對(duì)象中添加一個(gè)屬性,是一個(gè)空對(duì)象
          b[key]={};
          //再次調(diào)用這個(gè)函數(shù),把a(bǔ)對(duì)象中的屬性對(duì)象的值一個(gè)一個(gè)的復(fù)制到b對(duì)象的這個(gè)屬性對(duì)象中
          extend(item,b[key]);
        }else{
          //如果值是普通的數(shù)據(jù),直接復(fù)制到b對(duì)象的這個(gè)屬性中
          b[key]=item;
        }
      }
    }

    extend(obj1,obj2);
    console.dir(obj1);
    console.dir(obj2);