• 浅谈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() 继续往下走。

  • 相关阅读:
    windows 下的 Apache SSL证书配置
    javascript xml字符串转为json对象
    php 服务端允许跨域访问
    前端自动化构建工具 gulp 学习笔记 一、
    mysql使用select语句导出表数据时,报error 1290解决方法
    批量操作系统服务的脚本(windows关闭服务脚本)
    Dism++备份还原系统
    Win10开启蓝屏信息记录及文件查看位置的方法
    MySql 8.0服务端安装后,用navicat12连接时报2059错误_解决
    软件测试之细节功能测试_注意点
  • 原文地址:https://www.cnblogs.com/wobushitiegan/p/12970180.html
Copyright © 2020-2023  润新知