這一節(jié),主要講解面向?qū)ο蟮睦^承,回顧上一節(jié)講解到判斷對象原型和實例對象的兩種方法.廢話不多說,直接上代碼 !

繼承 ==> 重點

- 子對象-->父對象,Object是所有對象的父級

- 一種把其他對象的屬性和方法變?yōu)榧河械姆绞?/h6>

- 通過繼承可以提高代碼的復用性和可維護性

- 舉例 : 動物 -- 狗類 -- 金毛狗類

1.對于狗類來説:動物是它的父類型,而金毛狗類是它的子類型
2.對于金毛狗類來説.狗類是它的父類型,動物類是它的超類型.

繼承的兩種方式

• 接口繼承
• 實現(xiàn)繼承
• js中的繼承:
  javaScript中繼承只支持實現(xiàn)繼承,實現(xiàn)繼承主要依賴原型鏈來完成

Js中繼承的幾種實現(xiàn)方式

混入式繼承

• ** 示例代碼1 : **

    //1. 創(chuàng)建一個空的對象o
    var o = {};

    //2. 提供一個已經(jīng)有的對象obj
    var obj = {
        name:"對象的屬性",
        age:20,
        sayHello:function () {
            console.log("hello");
        }
    }

    //3. 混入式繼承(把原有對象的所有屬性和方法都拷貝給新的對象)
    for(var k in obj)
    {
        o[k] = obj[k];
    }

    //4. 打印查看o對象
    console.log(o);

    //5. 如果屬性的值是引用類型的,那么子對象和父對象共享一塊數(shù)據(jù),修改了某個對象對另外一個對象有影響
    console.log(o.sayHello == obj.sayHello);    //true

• **示例代碼2 : **

<script>
    //參數(shù):
    //第一個參數(shù)是目標對象
    //第二個,第三個參數(shù)是要拷貝屬性的對象
    var o = {};
    var obj1 = {name:"name"};
    var obj2 = {age:20};
    var obj3 = {car:{type:"飛船"}};

    Object.assign(o,obj2,obj1,obj3);
    console.log(o);

    obj3.car.type = '汽車';
    console.log(o);
</script>

原型式繼承

• 原型對象中的成員(屬性|方法)可以被使用該構(gòu)造函數(shù)創(chuàng)建出來的所有對象共享
• 利用上面的性質(zhì),可以實現(xiàn)原型式的繼承
• **示例代碼1 : **

<script>
    //1. 提供一個構(gòu)造函數(shù)
    function Person(name,age) {
        this.name = name;
        this.age = age;
    }

    //2. 設(shè)置原型對象的屬性
    Person.prototype.className = "逍遙派1班";

    //3. 使用構(gòu)造函數(shù)來創(chuàng)建原型對象
    var p1 = new Person("張三",10);
    var p2 = new Person("李四",20);

    //4. 打印p1和p2對象中的className屬性
    console.log(p1.className);
    console.log(p2.className);

    //結(jié)論:對象p1和p2繼承了構(gòu)造函數(shù)原型對象中的屬性className
    //但是這并不是嚴格意義上的繼承
</script>

• **示例代碼2 : **

<script>
    //1. 提供一個構(gòu)造函數(shù)
    function Person(name,age) {
        this.name = name;
        this.age = age;
    }

    //2. 設(shè)置原型對象的屬性
    Person.prototype = {
        constructor:Person,
        className:"逍遙派1班"
    };

    //3. 使用構(gòu)造函數(shù)來創(chuàng)建原型對象
    var p1 = new Person("張三",10);
    var p2 = new Person("李四",20);

    //4. 打印p1和p2對象中的className屬性
    console.log(p1.className);
    console.log(p2.className);

    //結(jié)論:對象p1和p2繼承了構(gòu)造函數(shù)原型對象中的屬性className
    //注意:使用原型替換的方式實現(xiàn)繼承的時候,原有原型對象中的屬性和方法會丟失
</script>

**示例代碼3 : **

<script>
    //1. 提供超類型|父類型
    function SuperClass() {
        this.name = 'SuperClass的名稱';
        this.showName = function () {
            console.log(this.name);
        }
    }

    //2. 設(shè)置父類型的原型屬性和原型方法
    SuperClass.prototype.info = 'SuperClass的信息';
    SuperClass.prototype.showInfo = function () {
        console.log(this.info);
    };

    //3. 提供子類型
    function SubClass() {
    }

    //4. 設(shè)置繼承(原型對象繼承)
    SubClass.prototype = SuperClass.prototype;
    SubClass.prototype.constructor = SubClass;

    var sub = new SubClass();
    console.log(sub.name);          //undefined
    console.log(sub.info);          //SuperClass的信息
    sub.showInfo();                 //SuperClass的信息
    sub.showName();                 //sub.showName is not a function
</script>

• 存在的問題 :

1.構(gòu)造器屬性指向(默認指向的是父構(gòu)造函數(shù))
2.無法獲得實例屬性和方法,只能繼承(獲得)父構(gòu)造函數(shù)原型對象的屬性和方法

• **擴展內(nèi)置對象 **
  要給數(shù)組擴展一個name的屬性和一個sayHello方法
• 示例代碼 :

<script>
    //1. 創(chuàng)建數(shù)組對象
    var arr = [1,2,3];
    var arr2 = new Array(1,2,3);
    console.log(arr2);

    //2. 設(shè)置Array構(gòu)造函數(shù)的原型對象
    Array.prototype.name = "默認的名稱";
    Array.prototype.sayHello = function () {
        console.log("hello");
    };

    console.log(arr.name);  //默認的名稱
    console.log(arr2.name); //默認的名稱
    arr.sayHello();         //hello
    arr2.sayHello();        //hello


    //1.上面的方式可以達到擴展內(nèi)置對象的效果,但不推薦這樣去做
    //2.遇到那種大項目可能需要多人合作一起開發(fā),而且項目中的代碼數(shù)量可能非常龐大
    //3.如果大家都通過這種方式來擴展內(nèi)置對象,那么日后必將難以管理,而且可能會出現(xiàn)方法被覆蓋等安全問題
</script>

• 安全的擴展內(nèi)置對象

核心過程
1.提供一個構(gòu)造函數(shù)（自定義）
2.設(shè)置構(gòu)造函數(shù)的原型對象為內(nèi)置構(gòu)造函數(shù)創(chuàng)建出來的對象

• 示例代碼 :

    //Array
    function MyArray(){};
    //設(shè)置原型對象
    MyArray.prototype = new Array();
    MyArray.prototype.des = "描述信息";
    MyArray.prototype.logDes = function(){
        console.log(this.des);
    }

    //使用自己的構(gòu)造函數(shù)來創(chuàng)建對象
    var myArr01 = new MyArray();
    var myArr02 = new MyArray();
    myArr01.push("123","abc");
    console.log(myArr01);
    console.log(myArr01.des);


    function OtherArray(){};
    OtherArray.prototype = new Array();
    OtherArray.prototype.des = "描述信息";
    OtherArray.prototype.logDes = function(){
        console.log("------------");
    }

    var otherArr01 = new OtherArray();
    var otherArr02 = new OtherArray();

    console.log(otherArr01.des);
    otherArr01.logDes();

• 圖解

**安全擴展內(nèi)置對象**

原型鏈繼承 ( 什么是原型鏈 ? )

• 每個對象都是由構(gòu)造函數(shù)創(chuàng)建出來的，因為每個對象都有構(gòu)造函數(shù)

• 每個構(gòu)造函數(shù)都有一個與之對應(yīng)的原型對象

• 原型對象本身也是對象

• 因此，原型對象也有自己的構(gòu)造函數(shù)

• 原型對象的構(gòu)造函數(shù)也有自己的原型對象

• 原型對象的構(gòu)造函數(shù)的原型對象也是對象鳍徽，所以它也有自己的構(gòu)造函數(shù)

• 原型對象的構(gòu)造函數(shù)的原型對象的構(gòu)造函數(shù)也有自己的原型對象霹期。
  以上，形成一個鏈式的結(jié)構(gòu)快压，就稱為是原型鏈

• 原型鏈的頂端是Object.prototype,Object.prototype本身也是一個對象圆仔，因此也有原型對象
  Object.prototype.__proto__ 是null

• 原型鏈的搜索規(guī)則 :

是向上查找,如果有直接使用,如果沒有,繼續(xù)向上查找.直到找到原型鏈的頂端
原型鏈搜索的路徑越長，查詢屬性所花費的時間就越多
原則：就近原型
**

• 繼承方法

1.提供一個父構(gòu)造函數(shù)
2.提供子構(gòu)造函數(shù)
3.設(shè)置子構(gòu)造函數(shù)的原型對象為父構(gòu)造函數(shù)的一個實例對象
4.在這個實例對象上面設(shè)置屬性和方法

• **示例代碼 : **

<script>
    function A(){
        this.age = 55;
        this.showAge = function(){
            console.log(this.age);
        }
    };

    //設(shè)置A的屬性和方法
    A.prototype.logDes = function(){
        console.log("des");
    }

    function B(){

    };
    //設(shè)置原型鏈繼承
    B.prototype = new A();
    B.prototype.des = "des";
    B.prototype.show = function(){
        console.log("show");
    };

    var b1 = new B();
    console.log(b1.age);
    b1.showAge();
    b1.logDes();
    console.log(b1);
</script>

• 復雜的原型鏈

1.提供構(gòu)造函數(shù)（4）
2.設(shè)置屬性和方法（建議：屬性設(shè)置在實例上蔫劣，方法設(shè)置在原型上）
3.設(shè)置繼承
4.修正構(gòu)造器屬性

• 示例代碼 :

<script>
    Animal.prototype.run = function(){
        console.log("run");
    }
    function Animal(color){
        this.color = color
    }

    Person.prototype = new Animal();
    Person.prototype.eat = function(){
        console.log("chi");
    }
    Person.prototype.constructor = Person;

    function Person(){
        this.name = "默認的名稱"
    }

    Student.prototype = new Person();
    Student.prototype.study = function(){
        console.log("good good study, day day up");
    }
    Student.prototype.constructor = Student;

    function Student(){
        this.id = "20160501"
    }

    Boy.prototype = new Student();
    Boy.prototype.lol = function(){
        console.log("LoL");
    }
    Boy.prototype.constructor = Boy;

    function Boy(){
        this.sex = "男"
    }

    //創(chuàng)建對象
    var boy = new Boy("紅色");
    console.log(boy);
</script>

• 原型鏈繼承的注意點

1.注意必須要在設(shè)置子對象的原型屬性和原型方法之前來實現(xiàn)繼承
2.在子對象的原型對象中可以設(shè)置同名的屬性或方法,覆蓋父對象的原型對象中的屬性和方法
3.原型鏈繼承之后,使用字面量的方式來設(shè)置原型會導致之前的原型對象丟失

• 示例代碼1

<script>
    //注意點
    //如果代碼段2==>代碼段1 則運行正常,,如果代碼段1==>代碼段2,則報錯'eat方法不存在'
     function Person() {};

     Person.prototype.run = function () {
        console.log('Person__run');
     };

     function Man() {};


     //代碼段1
     Man.prototype.eat = function () {
        console.log('Man__eat');
     };

    //代碼段2
    Man.prototype = new Person(); //設(shè)置原型鏈繼承

     var m = new Man();
     m.run();                //Person__run
     m.eat();                //Man__eat

    //建議:在設(shè)置完原型鏈繼承之后,再設(shè)置子對象原型對象上面的屬性和方法,否則會丟失(之前的原型對象被切斷)
</script>

• 示例代碼2 :

<script>
    // 注意點2 && 注意點3
    // 在子對象中(原型對象中)可以重寫父對象中(原型對象中)的方法
    // 子對象在調(diào)用的時候原型對象中的方法會覆蓋父對象原型對象中的
    // 方法,父類型的實例調(diào)用方法不受影響

     function Person() {};
     Person.prototype.run = function () {
        console.log('Person__run');
     };

     function Man() {};

     //代碼段2
     Man.prototype = new Person(); //設(shè)置原型鏈繼承
     Man.prototype.run = function () {
     console.log('Man__run');
     };

     var m = new Man();
     m.run();                //Man__run
     var p = new Person();
     p.run();                //Person__run

</script>

-示例代碼3 :

<script>
    // 在重寫原型對象實現(xiàn)繼承之后,不能使用字面量的方式來設(shè)置原型對象,
    // 否則之前的原型繼承關(guān)系會被切斷
    function Person() {};
    Person.prototype.run = function () {
        console.log('Person__run');
    };

    function Man() {};

    //代碼段2
    Man.prototype = new Person(); //設(shè)置原型鏈繼承
    Man.prototype = {
        eat:function () {
            console.log('Man__eat');
        }
    }

    var m = new Man();
    m.eat();    //Man__eat
    m.run();    //調(diào)用的方法不存在
</script>

• 原型鏈繼承存在的問題

1.父類型實例屬性會轉(zhuǎn)換為子類型原型的原型屬性坪郭，而如果父類型是實例屬性是引用類型則會存在共享問題
2.在創(chuàng)建子類型的實例時，不能向父類型的構(gòu)造函數(shù)中傳遞參數(shù)

• ** 示例代碼 : **

<script>
    //1. 提供父類型的構(gòu)造函數(shù)
    function SuperType() {
        //2. 在構(gòu)造函數(shù)中中設(shè)置實例屬性,該屬性為引用類型
        this.family = ['哥哥','姐姐','爸爸','媽媽'];
    };

    //3. 提供子類型的構(gòu)造函數(shù)
    function SubType() {};

    //4. 設(shè)置原型繼承
    SubType.prototype = new SuperType();

    //5. 創(chuàng)建父類型的實例對象,并對內(nèi)部的實例化屬性進行修改
    var subDemo1 = new SubType();
    var subDemo2 = new SubType();

    console.log(subDemo1);
    alert(subDemo1.family);    //哥哥,姐姐,爸爸,媽媽
    alert(subDemo2.family);      //哥哥,姐姐,爸爸,媽媽

    subDemo1.family.push('爺爺','奶奶');
    alert(subDemo1.family);    //哥哥,姐姐,爸爸,媽媽,爺爺,奶奶
    alert(subDemo2.family);    //哥哥,姐姐,爸爸,媽媽,爺爺,奶奶

    //6. 如果父類型的實例屬性中有引用類型,那么在子類型創(chuàng)建的實例對象中存在共享問題
</script>

• Object.Create
• 作用：創(chuàng)建對象脉幢，并且設(shè)置該對象的原型對象
• 兼容性問題：ES5
• 基本用法
• **示例代碼1 : **

<script>
    //JavaScript語言精粹
    function create(o) {
        var F = function () {};
        F.prototype = o;
        return new F();
    }

    var obj1 = create({name:"默認的名字"});
    console.log(obj1);

    //把參數(shù)(對象)作為新對象的原型對象
    var obj = Object.create({name:"默認的名字"});
    console.log(obj);
    //需要考慮到瀏覽器兼容的問題
</script>

• 實例代碼2 : 若不兼容則動態(tài)添加create方法

<script>
    var tmp = {age:20};
    if (Object.create){
        //如果有值那么就直接調(diào)用
        var o = Object.create(tmp)
    }
    else{
        Object.create = function () {
            var F = function () {};
            F.prototype = tmp;
            var o = new F();
        }
    }
</script>

• **示例代碼3 : 使用函數(shù)來封裝 **

<script>
    function create(o) {
        if (Object.create)
        {
            //如果有值那么就直接調(diào)用
            return Object.create(o)
        }else
        {
            var F = function () {};
            F.prototype = o;
            return F();
        }
    }
    var a = create({name:"默認的名字",age:20});
    console.log(a);
</script>

• call && apply函數(shù) ==> 重點

**1.這兩個方法都是原型對象上面的方法 -- 借用其他對象的方法
2.call和apply兩個函數(shù)的作用是一樣的歪沃，都可以用來借用方法
參數(shù)：
第一個參數(shù)是調(diào)用該方法的對象（函數(shù)內(nèi)部的this綁定的對象）
后面的參數(shù)：
call:參數(shù)列表
apply:數(shù)組
3.調(diào)用方法
對象1.方法.call(調(diào)用方法的真正的對象，參數(shù)1鸵隧，參數(shù)2绸罗，參數(shù)3)；

對象1.方法.apply(調(diào)用方法的真正的對象豆瘫，[參數(shù)1珊蟀，參數(shù)2，參數(shù)3..]);**

• **示例代碼 : **

<script>
    //console.log(Function.prototype);
    var demo01 = {
        name:"小偷",
        showName:function(param1,param2){
            console.log(this.name,param1,param2);
        }
    }
    var demo02 = {
        name:"我是老實人"
    }

    demo01.showName("小賊","毛賊");
    demo01.showName.call(demo02,"江洋大盜","采花大盜");
    demo01.showName.apply(demo02,["山賊","土匪"]);
</script>

• 關(guān)于this

1.javaScript中的this總是指向一個對象外驱。
2.調(diào)用方式 :
2.1作為對象的方法來調(diào)用 this--->當前的對象
2.2作為普通的函數(shù)調(diào)用 this--->window
2.3作為構(gòu)造函數(shù)和new使用 this--->構(gòu)造函數(shù)內(nèi)部新創(chuàng)建的對象
2.4被call或者是apply調(diào)用（函數(shù)上下文調(diào)用） this--->第一個參數(shù)

• ** 示例代碼1 : 當函數(shù)作為對象的方法調(diào)用時,this指向該對象**

<script>
    var obj = {
        name:"張三",
        demoFunc:function () {
            console.log(this == obj);       //true
            console.log(this.name);         //張三
        }
    }
    obj.demoFunc();
</script>

• 示例代碼2 : 當函數(shù)作為普通函數(shù)調(diào)用是,this總是指向全局對象

<script>
    window.name = "window測試的name";
    var funcName = function () {
        console.log(this.name);     //window測試的name
    }
    funcName();
</script>

• 示例代碼3: 使用new 構(gòu)造函數(shù)創(chuàng)建對象調(diào)用,this總是指向內(nèi)部默認創(chuàng)建并返回的對象

<script>
    function Person() {
        this.name = "默認的姓名"
    }

    var p1 = new Person();
    console.log(p1.name);   //默認的姓名
</script>

• ** 實例代碼4: Function.prototype.call或Function.prototype.apply調(diào)用**

<script>
    var obj = {
        name:"張三",
        getName:function () {
            console.log(this.name);
        }
    }
    obj.getName();      //張三
    var obj2 = {name:"李四"};
    obj.getName.call(obj2); //打印李四
</script>

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

• 借用構(gòu)造函數(shù)實現(xiàn)繼承：可以獲得父構(gòu)造函數(shù)中的實例屬性育灸，解決了傳參的問題
• 示例代碼 :

<script>
    function Person(name,age){
        this.name = name;
        this.age = age;
    };
    function Boy(bookName,name,age){
        this.bookName = bookName;
        //Person.call(this,"八戒",600);  //借用構(gòu)造函數(shù)
        Person.call(this,name,age);
    }

    //創(chuàng)建對象
    var boy = new Boy("水煮三國","悟空",600);
    var boy02 = new Boy("大話西游","云風",40);
    console.log(boy);
    console.log(boy02);
</script>

組合(原型鏈 + 借用)繼承

• 借用構(gòu)造函數(shù)實現(xiàn)繼承：可以獲得父構(gòu)造函數(shù)中的實例屬性
  Person.call(this,name,age)

• 獲得原型屬性和方法 ( Boy.prototype = Person.prototype)

• 組合繼承：原型 + 借用構(gòu)造函數(shù)

• **示例代碼 : **

<script>
    function Person(name,age){
        this.name = name;
        this.age = age;
    };
    Person.prototype.des = "描述信息";
    Person.prototype.logDes = function(){
        console.log(this.des);
    };

    function Boy(bookName,name,age){
        this.bookName = bookName;
        //Person.call(this,"八戒",600);  //借用構(gòu)造函數(shù)
        Person.call(this,name,age);
    }

    //設(shè)置原型繼承
    //Boy.prototype = new Person();
    Boy.prototype = Person.prototype;

    //創(chuàng)建對象
    var boy = new Boy("水煮三國","悟空",600);
    var boy02 = new Boy("大話西游","云風",40);
    console.log(boy);
    console.log(boy02);
    boy.logDes();

    var p1 = new Person();
    p1.logDes();

    Boy.prototype.des = "描述信息-bOY";
    boy.logDes();
    p1.logDes();
</script>

深拷貝和淺拷貝

• **示例代碼 : 淺拷貝 **

<script>
    var obj = {
        name:"小花臉",
        car:{
            type:"客車"
        }
    };
    var o = {};
    for (var k in obj)
    {
        o[k] = obj[k];
    }

    console.log(o);
    o.car.type = "銀河戰(zhàn)艦";
    console.log(obj);
</script>

• 深拷貝

**1.提供一個函數(shù)，兩個參數(shù)（原對象昵宇，要拷貝屬性的對象）
2.在函數(shù)中先檢查第一個參數(shù)是否有值磅崭，如果沒有值那么就初始化一個空的對象
3.for..in循環(huán)來變量參數(shù)2,

3.1檢查當前的屬性值是什么類型
3.2如果是值類型，那么就直接拷貝賦值
3.3如果是引用類型瓦哎，那么就再調(diào)用一次這個方法砸喻，去內(nèi)部拷貝這個對象的所有屬性**

• 示例代碼 : 深拷貝封裝

<script  >
    var obj = {
        name:"小花臉",
        car:{
            type:"客車",
        },
        friends:["1","2","3"]
    };

    //兼容性處理
    if(typeof Array.isArray != "function") {
        Array.isArray = function(obj){
            return Object.prototype.toString.call(obj) == "[object Array]";
        }
    }

    var o = {};
    //deepCopy(o,obj);
    function deepCopy(obj1,obj2) {
        obj1 = obj1 || {};
        for (var i in obj2)
        {
            if (obj2.hasOwnProperty(i))
            {
                if( typeof obj2[i] == "object")
                {
                    //判斷是數(shù)組還是對象
                    obj1[i] = Array.isArray(obj2[i])?[]:{};
                    //引用類型
                    deepCopy(obj1[i],obj2[i]);   //函數(shù)調(diào)用
                }else
                {
                    //值類型
                    obj1[i] = obj2[i];
                }
            }
        }
    }

    deepCopy(o,obj);
    console.log(o);

    //共享問題
    //o.car.type = "小貨車";
    console.log(obj);
</script>

通過深拷貝實現(xiàn)繼承

• 完整的繼承方案

1.擁有父構(gòu)造函數(shù)的實例屬性
2.擁有父構(gòu)造函數(shù)的原型屬性
3.是相互獨立的，彼此不受影響

• ** 示例代碼 : **

<script>
    if(typeof Array.isArray != "function") {
        Array.isArray = function(obj){
            return Object.prototype.toString.call(obj) == "[object Array]";
        }
    }
    function deepCopy(obj1,obj2) {
        obj1 = obj1 || {};
        for (var i in obj2)
        {
            if (obj2.hasOwnProperty(i))
            {
                if( typeof obj2[i] == "object")
                {
                    //判斷是數(shù)組還是對象
                    obj1[i] = Array.isArray(obj2[i])?[]:{};
                    //引用類型
                    deepCopy(obj1[i],obj2[i]);   //函數(shù)調(diào)用
                }else
                {
                    //值類型
                    obj1[i] = obj2[i];
                }
            }
        }
    }

    function Person(name,age){
        this.name = name;
        this.age = age;
    };
    Person.prototype.des = "描述信息";
    Person.prototype.car = {
        type:"汽車"
    }
    Person.prototype.logDes = function(){
        console.log(this.des);
    };

    function Boy(bookName,name,age){
        this.bookName = bookName;
        //Person.call(this,"悟空",600);  //借用構(gòu)造函數(shù)
        Person.call(this,name,age);
    }

    //設(shè)置原型繼承
    //Boy.prototype = Person.prototype;
    deepCopy(Boy.prototype,Person.prototype);  //把父構(gòu)造函數(shù)原型對象上面的屬性和方法全部拷貝一份給Boy

    //創(chuàng)建對象
    var boy01 = new Boy("水煮三國","悟空",600);
    var boy02 = new Boy("大話西游","云風",40);

    Boy.prototype.car.type = "火車";
    console.log(Boy.prototype);

    var p1 = new Person();
    console.log(p1.car.type);
</script>

基本包裝類型

• String Number Boolean
• **示例代碼 : **

<script>
    //1. 創(chuàng)建字符串對象
    var str1 = new String("demo01");  //object
    var str2 = "demo01";              //string
    var str3 = String("demo01");     //string(正確) | object

    console.log(typeof str1);
    console.log(typeof str2);
    console.log(typeof str3);

    //2. 創(chuàng)建數(shù)字對象
    var num1 = new Number(10);      //object
    var num2 = 10;                  //number
    var num3 = Number(20);          //number

    //3. 布爾類型的對象
    var bool01 = new Boolean(true); //object
    var bool02 = true;              //boolean
    var bool03 = Boolean(true);
    console.log(typeof bool01);

    //4. 特殊的創(chuàng)建方式
    var str4 = new Object("demo01");    //object | string
    var num4 = new Object(10);
    var bool04 = new Object(true);

    console.log(typeof str4);
</script>

• 基本包裝類型注意點:

<script>
    var str1 = "demo01";                      //string
    var str2 = new String("demo01");          //object
    var str3 = String("demo01");

    console.log(str1 == str2);  //true  轉(zhuǎn)換
    console.log(str1 === str2); //false

    console.log(str1.length);   //6 獲得字符串的長度
    //基本數(shù)據(jù)類型的值怎么能夠訪問屬性呢蒋譬？
    //屬性和方法只有對象才有

    //為什么割岛？
    //字符串、數(shù)值以及布爾值在訪問屬性或者調(diào)用方法的時候
    //1. 內(nèi)部會隱式的創(chuàng)建一個對象犯助，利用該對象來訪問屬性或者是調(diào)用方法
    //2. 得到結(jié)果之后癣漆，把結(jié)果賦值給基本數(shù)據(jù)類型的值
    //3. 銷毀這個創(chuàng)建的對象

    str1.des = "描述信息";
    console.log(str1.des);            //undefined

    str2.des = "des";
    console.log(str2.des);           //des(正確的) | undefined
</script>

• 總結(jié)

1.變量的方式調(diào)用成功
2.表達式的方式調(diào)用成功
3.數(shù)值的方式調(diào)用失敗

• **示例代碼 : **

<script>
    Number.prototype.sum = function(param){
        return this + param;
    }

    var num1= new Number("10");
    var num2 = 30;

    console.log(num1.sum(2));
    console.log(num1.sum(33));
    console.log(num2.sum(44));  //可以調(diào)用嗎？ 74

    console.log((10).sum(11));      //可以調(diào)用嗎剂买？  （）表達式  21
    console.log(10.sum(22));        //不可以調(diào)用
</script>

附思維導圖一張,希望能幫到各位 ! 如果圖片不清晰的話 請下載到本地查看

Js - 面向?qū)ο缶幊倘?/div>