美文网首页
ES6结构赋值/面向对象

ES6结构赋值/面向对象

作者: KEN_CHEN | 来源:发表于2018-11-22 16:55 被阅读0次

    1.块级作用域

    类似于匿名函数

    格式:

    {

          xxx

    }

    可以解决密封空间的问题

    ps:var没有块的概念

    例1-1:

    代码(i是var类型的) 结果(三个按钮均为3)

    例1-2:

    代码(i为let类型) 结果

    例1-3:

    代码 结果(点击1变色) 结果(点击2变色)


    2.结构赋值

    格式:

    结构赋值格式

    ps:数组,JSON均可

    例2-1:

    json结构赋值

    JSON:key值必须对应

    例2-2:

    结构赋值实例


    3.bind

    与call类似

    call:

    任何函数都可以用call调用自己;

    call的第一个参数就是函数的this;

    第二个参数之后就是函数的形参。

    bind:

    任何函数都可以用bind调用自己;

    bind的第一个参数就是函数的this;

    第二个参数之后就是函数的形参;

    不会调用自己,加括号可调用。

    例3-1:

    代码

    this对应1;x对应10;y对应20


    结果

    例3-2:

    代码

    -->浏览器没反应

    例3-3:

    代码(多了个括号) 结果

    例3-4:

    代码

    this对应1;x对应2;y对应3

    例3-5:

    代码

    同上,this对应1;x对应2;y对应3,

    两个括号相当于一个


    4.面向对象

    [1]ES6之前


    1.类

    2.原型(prototype 别名:方法)

    3.原型链

    示意图

    类的上一级是Object

    查找原型:xxx.prototype;

    查找类:typeof  'xxx';

    .constructor 方法能精准的查找对应的类

    附加知识:字符串转数组用     x.split(' ')

    call/bind 可以使所有方法通用

    如:


    使array的方法join给字符串'abcd'

    ->3.原型链

    __proto__

    示意图

    [2]ES6里


    1.类 class

    无变量提升

    格式:

    class 名{

        constructor(){

        }

    }

    例1:

    代码 结果

    例2:

    代码

    constructor(){}里放私有属性

    结果

    2.继承

    extends

    子继承父所有的东西,父变化会影响子,子变化不影响父

    例:

    代码 结果

    相关文章

      网友评论

          本文标题:ES6结构赋值/面向对象

          本文链接:https://www.haomeiwen.com/subject/hkmlqqtx.html