zoukankan      html  css  js  c++  java
  • 浅谈JS-ES6新特性

    因为用到了,所以涉及一点,扫一下知识盲区。

    JS-ES6

    ECMAScript = ES = 是一套标准,类似于HTML5, JS是实现。

    image-20200521072710561

    兼容性

    ES6,IE10+,Chrome,FireFox,移动端,NodeJS 这些都是兼容的。

    编译、转换:

    1、在线转换 browser.js = babel

    2、提前编译

    ES6都有啥变动?

    1. 变量
    2. 函数
    3. 数组
    4. 字符串
    5. 面向对象
    6. Promise, 用来做串行话的异步请求
    7. generator,把同步操作拆成异步操作
    8. 模块化

    变量

    var

    1.可以重复声明

    2.无法限制修改

    3.没有块级作用域

    let

    1.不能重复声明

    2.变量,可以修改

    3.块级作用域

    const

    1.不能重复声明

    2.常量,不可以修改

    3.块级作用域

    函数

    箭头函数

    ()=>{

    } lambda表达式,是模仿Python里边的。

    1.如果只有一个参数,()可以省略。

    2.如果只有一个return,{}可以省略

    参数

    1.参数扩展/展开

    数组扩展:function show(a,b,...args){}

    ​ rest Parameter必须是最后一个

    展开数组: let arr = [1,2,3] show(...arr),

    2.默认参数

    ​ function show (a, b=4,c=12){} show(99,12)

    解构赋值

    1.左右两边结构必须一样

    2.右边必须是个东西

    3.声明和赋值不能分开(必须在一句话里完成)

    例如:

    数组: let [a,b,c] = [1,2,3] console.log(a,b,c)

    json: let {a,b,c} = {a:5,b:1,c:3}

    混合: let[{a,b},[n1,n2],num,str] = [{a:12,b:3},[1,2],3,f]

    数组

    Map 映射 一个对一个

    ​ let arr = [12,3,4] ; arr.map()

    reduce 汇总

    · 算总和: arr.reduce(tmp,item,index)

    ​ 算平均数:

    filter 过滤器

    ​ arr.filter(item=>return true/false)

    foreach 循环

    ​ arr.forEach(item,index => ())

    image-20200523095543678

    image-20200523100844411

    字符串

    1. 多了两个新方法

      startWith str.startWith("http://") ,

      endWith str.endWith(".png")

    2. 字符串模板

      let str = a${b}c; 反单引号

      i.直接把东西塞到字符串里边。 ${东西}

      ii.可以折行

    image-20200524114754897

    ES6的面向对象

    1. class 关键字,构造器和类分开了
    2. class里边直接加方法

    class User{

    ​ constructor(name,pass){

    ​ this.name = name;

    ​ this.pass = pass ;

    ​ }

    ​ showName(){

    ​ alert(name);

    ​ }

    }

    继承

    image-20200524123211007

    面向对象应用--React

    React: 基于组件开发

    1. 组件化-class
    2. JSX==babel == brower.js

    JSON

    1. JSON对象

      1. JSON.stringify(json): 串行化,将json对象转换成字符串
      2. JSON.parse(str) : 解析
    2. JSON的简写

      1. 名字和值(key和value)一样,留一个就行
      2. 方法 :function一块删

      例如:

      show : function(){...}

      show(){...}

    JSON对象:串行化,解析。

    JSON的标准写法:

    1. 只能用双引号
    2. 所有的名字都必须用引号抱起来

    Promise

    Promise 许诺,承诺。

    异步:操作和操作之间是没关系的,同时进行多个操作

    同步:操作之间相关,同时只能做一件事

    异步:代码更复杂

    同步:代码简单

    Promise,用同步的方式,来写异步代码

    1. Promise.all

    2. Promise.racs

    image-20200524204918709

    image-20200524204940628

    jQuery自带Promise。

    AJax的返回值就是Promise。

    image-20200524205152567

    image-20200524205220685

    Generator-生成器函数

    普通函数-一路到底 function show(){}

    generator函数-中间能停 function *show(){ a , yield ; c } 返回对象.next() 继续往下走。

  • 相关阅读:
    深度解析MVC3中的ModelValidator及相关unobtrusiveJs的验证(一)
    深度解析Asp.net中的验证和Mvc对它的继承
    C# WebBrowser保存页面为图片
    Vue-axios需要注意的几个点
    C# 为什么说事件是一种特殊的委托
    C# event 事件-2
    C# event 事件
    初始Redis与简单使用
    泛型的运用(用于查询数据后DataTable转实体类)
    C# 初识接口 Interface
  • 原文地址:https://www.cnblogs.com/wobushitiegan/p/12970180.html
Copyright © 2011-2022 走看看