美文网首页
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结构赋值/面向对象

    1.块级作用域 类似于匿名函数 格式: { xxx} 可以解决密封空间的问题 ps:var没有块的概念 例1-...

  • 6.ECMAScript6(ES6)- ES6的结构与赋值

    1、ES6的结构与赋值 (1)允许直接给数组进行赋值,也叫模版匹配 (2)ES6的对象与结构赋值 (3)对已经定义...

  • 26

    ES6 一、解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为结构赋值,解构赋值主要...

  • JavaScript26

    ES6 一、解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为结构赋值,解构赋值主要...

  • js day26

    ES6 一、解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为结构赋值,解构赋值主要...

  • ES6

    ##ES6 ### 一、解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为结构赋值,...

  • 2018-06-01解构赋值

    ##ES6 ### 一、解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为结构赋值...

  • ES6基础教程(第二节)——解构赋值

    es6在给对象赋值方面运用了一个新功能,称为解构赋值,以下是从数组的解构赋值,对象的解构赋值,字符串的结构赋值,以...

  • 解构赋值,箭头函数,剩余参数

    解构赋值(★★★) ES6中允许从数组中提取值,按照对应位置,对变量赋值,对象也可以实现解构 数组解构 对象结构 ...

  • 二.变量的解构赋值

    变量的结构赋值 数组的解构赋值 ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。 不完...

网友评论

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

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