From d860d5b645633a3f30a0d8fa38f8bc8d67104857 Mon Sep 17 00:00:00 2001 From: chochi1st Date: Fri, 24 May 2019 22:27:05 +0800 Subject: [PATCH] Site updated: 2019-05-24 22:27:05 --- .../22/3 \345\257\271\350\261\241/index.html" | 4 +- .../22/4 \345\207\275\346\225\260/index.html" | 8 +- .../index.html" | 4 +- 2019/05/22/6 Array/index.html | 25 ++- .../index.html" | 8 +- 2019/05/22/9 JavaScript Classes/index.html | 8 +- .../index.html" | 8 +- "2019/05/22/Call\344\270\216Apply/index.html" | 4 +- .../index.html" | 8 +- .../22/\347\273\247\346\211\277/index.html" | 34 ++-- archives/2019/05/index.html | 32 +-- archives/2019/index.html | 32 +-- archives/index.html | 32 +-- .../index.html" | 32 +-- .../page/2/index.html" | 4 +- content.json | 2 +- index.html | 190 ++++++++---------- tags/JS/index.html | 36 ++-- 18 files changed, 225 insertions(+), 246 deletions(-) diff --git "a/2019/05/22/3 \345\257\271\350\261\241/index.html" "b/2019/05/22/3 \345\257\271\350\261\241/index.html" index 1683274..6aed412 100644 --- "a/2019/05/22/3 \345\257\271\350\261\241/index.html" +++ "b/2019/05/22/3 \345\257\271\350\261\241/index.html" @@ -250,11 +250,11 @@

- +
- ECMA5 面向对象编程 + ECMA5 this指针
diff --git "a/2019/05/22/4 \345\207\275\346\225\260/index.html" "b/2019/05/22/4 \345\207\275\346\225\260/index.html" index c819a0f..ba89dd8 100644 --- "a/2019/05/22/4 \345\207\275\346\225\260/index.html" +++ "b/2019/05/22/4 \345\207\275\346\225\260/index.html" @@ -265,18 +265,18 @@

- +
- ECMA5 数组 + ECMA5 继承
- -
ECMA5 面向对象编程
+ +
ECMA5 this指针
 diff --git "a/2019/05/22/5 \346\240\207\345\207\206\345\272\223/index.html" "b/2019/05/22/5 \346\240\207\345\207\206\345\272\223/index.html" index 996ff34..d772521 100644 --- "a/2019/05/22/5 \346\240\207\345\207\206\345\272\223/index.html" +++ "b/2019/05/22/5 \346\240\207\345\207\206\345\272\223/index.html" @@ -249,8 +249,8 @@

-
ECMA5 包装对象
+ +
ECMA5 面向对象编程
 diff --git a/2019/05/22/6 Array/index.html b/2019/05/22/6 Array/index.html index ab09646..2125ce0 100644 --- a/2019/05/22/6 Array/index.html +++ b/2019/05/22/6 Array/index.html @@ -8,18 +8,18 @@ ECMA5 数组 | chochi's workshop - + - + - + - + @@ -164,14 +164,13 @@

1 静态方法

1.1 判断是否为数组

    -

  1. 使用Array的静态方法

    +
  2. 使用Array的静态方法
    3. +
1
Array.isArray( array )
- -

  • 使用原型toString方法，返回的字符串第二个词表示构造函数

    -
    • +
      +
    1. 使用原型toString方法，返回的字符串第二个词表示构造函数 
    1
    Object.prototype.toString.call( array ) // [object array]
    -
    1. instanceof (不太靠谱)
    @@ -250,18 +249,18 @@

    - +
    - ECMA5 继承 + ECMA5 包装对象
    - -
    ECMA5 函数
    +     +
    ECMA5 CALL APPLY 模拟
     diff --git "a/2019/05/22/7 \345\214\205\350\243\205\345\257\271\350\261\241 wrapper/index.html" "b/2019/05/22/7 \345\214\205\350\243\205\345\257\271\350\261\241 wrapper/index.html" index b0fd101..a2ceab3 100644 --- "a/2019/05/22/7 \345\214\205\350\243\205\345\257\271\350\261\241 wrapper/index.html" +++ "b/2019/05/22/7 \345\214\205\350\243\205\345\257\271\350\261\241 wrapper/index.html" @@ -256,18 +256,18 @@

    - +
    - ECMA5 标准库 + ECMA6 类
    - -
    ECMA6 类
    +     +
    ECMA5 数组
     diff --git a/2019/05/22/9 JavaScript Classes/index.html b/2019/05/22/9 JavaScript Classes/index.html index d5fa832..7d41643 100644 --- a/2019/05/22/9 JavaScript Classes/index.html +++ b/2019/05/22/9 JavaScript Classes/index.html @@ -236,18 +236,18 @@

    - +
    - ECMA5 包装对象 + ECMA5 面向对象编程
    - -
    ECMA5 this指针
    +     +
    ECMA5 包装对象
     diff --git "a/2019/05/22/9 \351\235\242\345\220\221\345\257\271\350\261\241\347\274\226\347\250\213/index.html" "b/2019/05/22/9 \351\235\242\345\220\221\345\257\271\350\261\241\347\274\226\347\250\213/index.html" index 25f53ae..b457910 100644 --- "a/2019/05/22/9 \351\235\242\345\220\221\345\257\271\350\261\241\347\274\226\347\250\213/index.html" +++ "b/2019/05/22/9 \351\235\242\345\220\221\345\257\271\350\261\241\347\274\226\347\250\213/index.html" @@ -277,18 +277,18 @@

    - +
    - ECMA5 函数 + ECMA5 标准库
    - -
    ECMA5 对象
    +     +
    ECMA6 类
     diff --git "a/2019/05/22/Call\344\270\216Apply/index.html" "b/2019/05/22/Call\344\270\216Apply/index.html" index eff4596..5c05de7 100644 --- "a/2019/05/22/Call\344\270\216Apply/index.html" +++ "b/2019/05/22/Call\344\270\216Apply/index.html" @@ -234,11 +234,11 @@

    - +
    - ECMA5 this指针 + ECMA5 数组
    diff --git "a/2019/05/22/\345\205\263\344\272\216 this \346\214\207\351\222\210/index.html" "b/2019/05/22/\345\205\263\344\272\216 this \346\214\207\351\222\210/index.html" index 097d351..4a65c40 100644 --- "a/2019/05/22/\345\205\263\344\272\216 this \346\214\207\351\222\210/index.html" +++ "b/2019/05/22/\345\205\263\344\272\216 this \346\214\207\351\222\210/index.html" @@ -218,18 +218,18 @@

    1

    @@ -342,19 +332,19 @@

    2 -
    +

    - ECMA5 数组 + ECMA5 函数

    - + @@ -362,16 +352,12 @@

    -

    1 静态方法

    1.1 判断是否为数组

      -

    1. 使用Array的静态方法

      -
      1
      Array.isArray( array )
      -
      2. -

    2. 使用原型toString方法，返回的字符串第二个词表示构造函数

      -
      3. -
    -
    1
    Object.prototype.toString.call( array ) // [object array]
    +

    1 概述

    1.1 重复声明

      +
    • 函数的声明会提升到函数定义时所在的作用域的头部。故同名函数会被后来的函数替代。
      • +
    +
    1
    2
    3
    4
    5
    6
    7
    8
    function f(){
        console.log('one');
    }
    f();    //two
    function f(){
        console.log('two');
    }
    f();    //two
    - more >> + more >> @@ -406,7 +392,7 @@

    - 展开全文 >> + 展开全文 >>

    @@ -436,19 +422,19 @@

    +

    - ECMA5 函数 + ECMA5 this指针

    - + @@ -456,12 +442,14 @@

    -

    1 概述

    1.1 重复声明

      -
    • 函数的声明会提升到函数定义时所在的作用域的头部。故同名函数会被后来的函数替代。
      • +

      1 概念

        +
      • this 对象时运行时基于函数的执行环节绑定的，在全局函数中，this等于window，而当函数被作为某个对象的方法调用时，this等于那个对象。
        • +
      • 匿名函数的执行环节具有全局性，因此this指针对象通常指向window
        • +
      -
      1
      2
      3
      4
      5
      6
      7
      8
      function f(){
          console.log('one');
      }
      f();    //two
      function f(){
          console.log('two');
      }
      f();    //two
      +
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      let obj = {
         fun : function(){
             console.log(this);//obj

             return function(){

              console.log(this);//window 匿名函数有全局性
             };  
         }
      };
      - more >> + more >> @@ -496,7 +484,7 @@

      1

      - 展开全文 >> + 展开全文 >>

      @@ -526,19 +514,19 @@

      1 -
      +

      - ECMA5 面向对象编程 + ECMA5 对象

      - + @@ -546,17 +534,14 @@

      -

      1 实例对象与new 命令

      1.1 构造函数

        -
      • 函数体内部使用了 this 关键字，代表了所要生成的对象实例。
        • -
      • 生成对象的时候，必须使用 new 命令
        • -
      • 函数名首字母大写，以示区别。
        • -
      -

      1.2 new 命令

        -
      • 执行构造函数，返回一个对象实例。
        • +

        1 键名

          +
        • 对象的所有键名都是字符串，若键名不符合标识符的条件，则必须加上引号。
          • +
        • 如果使用方运算符，键名必须放在引号里，否则会被当做变量处理。
          • +
        • 数字键可以不加引号，会自动转成字符串。
          1
          2
          3
          4
          5
          6
          let obj  = { flag: true };
          obj[flag]       // undefined
          obj.flag        // true
          obj.['flag']    // true
          flag ='flag';
          obj[flag]       // ture
          +
        -

        1.2.1 new 原理

        1
        2
        3
        4
        graph TB
            A[1.创建一个空对象作为将要返回的对象实例]--> B[2.将这个空对象的原型指向构造函数的prototype属性]
            B-->C[3.将空对象赋值给函数内部的this关键字]
            C-->D[4.开始执行构造函数内部的代码]
        - more >> + more >> @@ -591,7 +576,7 @@

        - 展开全文 >> + 展开全文 >>

        @@ -621,19 +606,19 @@

        +

        - ECMA5 对象 + ECMA5 标准库

        - + @@ -641,14 +626,10 @@

        -

        1 键名

          -
        • 对象的所有键名都是字符串，若键名不符合标识符的条件，则必须加上引号。
          • -
        • 如果使用方运算符，键名必须放在引号里，否则会被当做变量处理。
          • -
        • 数字键可以不加引号，会自动转成字符串。
          1
          2
          3
          4
          5
          6
          let obj  = { flag: true };
          obj[flag]       // undefined
          obj.flag        // true
          obj.['flag']    // true
          flag ='flag';
          obj[flag]       // ture
          -
          • -
        +

        1 判断某个变量是否为函数

        1
        2
        3
        function isObject(value){
                return value === Object(value);
            }
        +

        2 对象的键名

        - more >> + more >> @@ -683,7 +664,7 @@

        1

        - 展开全文 >> + 展开全文 >>

        @@ -713,19 +694,19 @@

        1 -
        +

        - ECMA5 标准库 + ECMA5 面向对象编程

        - + @@ -733,10 +714,17 @@

        -

        1 判断某个变量是否为函数

        1
        2
        3
        function isObject(value){
                return value === Object(value);
            }
        -

        2 对象的键名

        +

        1 实例对象与new 命令

        1.1 构造函数

          +
        • 函数体内部使用了 this 关键字，代表了所要生成的对象实例。
          • +
        • 生成对象的时候，必须使用 new 命令
          • +
        • 函数名首字母大写，以示区别。
          • +
        +

        1.2 new 命令

          +
        • 执行构造函数，返回一个对象实例。
          • +
        +

        1.2.1 new 原理

        1
        2
        3
        4
        graph TB
            A[1.创建一个空对象作为将要返回的对象实例]--> B[2.将这个空对象的原型指向构造函数的prototype属性]
            B-->C[3.将空对象赋值给函数内部的this关键字]
            C-->D[4.开始执行构造函数内部的代码]
        - more >> + more >> @@ -771,7 +759,7 @@

        - 展开全文 >> + 展开全文 >>

        @@ -801,19 +789,19 @@

        +

        - ECMA5 包装对象 + ECMA6 类

        - + @@ -821,16 +809,9 @@

        -

        1 定义

          -
        • 数值、字符串、布尔值这三种原型类型的值，在一听条件下也会自动转化为对象，也就是原始类型的包装对象。
          • -
        • Number String Boolean
          • -
        • 包装对象的目的，是得对象模型覆盖js所优质，正门语言都有一个通用的数据模型，其次是得原始类型的值也有可以调动自己的方法。
          • -
        • 原始类型的值会自动当做包装对象调用，即调用包装对象的属性和方法。JS引擎糊自动将原始类型的值转换为包装对象实例，并在使用后立即销毁。
          • -
        • 自动转换生成的包装对象是只读的，无法修改。
          • -
        -
        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        var str = 'abc';
        str.length; // 3

        // 等同于
        var strObj = new String(str);
        /*
            String{
                0:"1",1:"b",2;"c",length:3[[PrimitiveValue]]:"abc"
            }
            strObj.length;//3
        */
        +

        Classes

        1 Class-Like structures in ecma5

        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        12
        13
        14
        // property
        function PersonType(name){
            this.name = name;
        }

        // methods: be assigned to the prototype 
        // all instances of the object share the same function
        PersonType.prototype.sayName = function(){
            console.log(this.name);
        }

        let person = new PersonType('chochi');
        person.sayName();
        // person is a instance of obeject and PersonType
        - more >> + more >> @@ -865,7 +846,7 @@

        1

        - 展开全文 >> + 展开全文 >>

        @@ -895,19 +876,19 @@

        1 -
        +

        - ECMA6 类 + ECMA5 包装对象

        - + @@ -915,9 +896,16 @@

        -

        Classes

        1 Class-Like structures in ecma5

        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        12
        13
        14
        // property
        function PersonType(name){
            this.name = name;
        }

        // methods: be assigned to the prototype 
        // all instances of the object share the same function
        PersonType.prototype.sayName = function(){
            console.log(this.name);
        }

        let person = new PersonType('chochi');
        person.sayName();
        // person is a instance of obeject and PersonType
        +

        1 定义

          +
        • 数值、字符串、布尔值这三种原型类型的值，在一听条件下也会自动转化为对象，也就是原始类型的包装对象。
          • +
        • Number String Boolean
          • +
        • 包装对象的目的，是得对象模型覆盖js所优质，正门语言都有一个通用的数据模型，其次是得原始类型的值也有可以调动自己的方法。
          • +
        • 原始类型的值会自动当做包装对象调用，即调用包装对象的属性和方法。JS引擎糊自动将原始类型的值转换为包装对象实例，并在使用后立即销毁。
          • +
        • 自动转换生成的包装对象是只读的，无法修改。
          • +
        +
        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        var str = 'abc';
        str.length; // 3

        // 等同于
        var strObj = new String(str);
        /*
            String{
                0:"1",1:"b",2;"c",length:3[[PrimitiveValue]]:"abc"
            }
            strObj.length;//3
        */
        - more >> + more >> @@ -952,7 +940,7 @@

        Class

        - 展开全文 >> + 展开全文 >>

        @@ -982,19 +970,19 @@

        Class -
        +

        - ECMA5 this指针 + ECMA5 数组

        - + @@ -1002,19 +990,19 @@

        -

        1 概念

          -
        • this 对象时运行时基于函数的执行环节绑定的，在全局函数中，this等于window，而当函数被作为某个对象的方法调用时，this等于那个对象。
          • -
        • 匿名函数的执行环节具有全局性，因此this指针对象通常指向window
          • -
        • -
        -
        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        let obj = {
           fun : function(){
               console.log(this);//obj

               return function(){

                console.log(this);//window 匿名函数有全局性
               };  
           }
        };
        +

        1 静态方法

        1.1 判断是否为数组

          +
        1. 使用Array的静态方法
          2. +
        +
        1
        Array.isArray( array )
        +
          +
        1. 使用原型toString方法，返回的字符串第二个词表示构造函数 - more >> + more >> -
        +

        @@ -1044,7 +1032,7 @@

        1

        - 展开全文 >> + 展开全文 >>

        diff --git a/tags/JS/index.html b/tags/JS/index.html index ff64137..7128154 100644 --- a/tags/JS/index.html +++ b/tags/JS/index.html @@ -155,14 +155,14 @@

        chochi

        - +

        - ECMA5 标准库 + ECMA5 面向对象编程

        @@ -204,14 +204,14 @@

        - +

        - ECMA5 面向对象编程 + ECMA5 this指针

        @@ -253,14 +253,14 @@

        - +

        - ECMA5 函数 + ECMA5 CALL APPLY 模拟

        @@ -302,14 +302,14 @@

        - +

        - ECMA5 包装对象 + ECMA5 对象

        @@ -351,14 +351,14 @@

        - +

        - ECMA5 对象 + ECMA5 标准库

        @@ -400,14 +400,14 @@

        - +

        - ECMA5 数组 + ECMA5 函数

        @@ -449,14 +449,14 @@

        - +

        - ECMA5 CALL APPLY 模拟 + ECMA6 类

        @@ -498,14 +498,14 @@

        - +

        - ECMA6 类 + ECMA5 包装对象

        @@ -547,14 +547,14 @@

        - +

        - ECMA5 this指针 + ECMA5 数组