(十二)ES6简易缩略版本

本节重点讲解知识划分

(1) Let 和Const的区别

  • 只能声明一次
  • Let能修改Const无法修改
  • 在块级作用域里面它出不来{}

(2) 箭头函数

  • 如果只有一个参数那么()可以省略
  • 如果函数体内只有一个return 那么{}可以省略

(3)解构赋值

  • 声明和赋值不能分开
  • 左边格式必须完全等于右边
  • 右边必须是个东西,比如对象,数组之类的

(4) 数组开始

  • 重点记住4个 fmfr
  • f ------- foreach 就是单纯的循环
let arr = [2,3,4];
arr.foreach((item,index)=>{
  console.log(item);
})
  • m-------map 就是映射,有map就有return
let score = [19, 85, 99, 25, 90];
let arr2 = score.map(item => {
  if (item > 60) {
    return "及格"
  } else {
    return "不及格"
  }
})
console.log(arr2);
  • f --------------filter 过滤 ,真的就留下
let guolv = [12, 5, 8, 99, 27, 36, 75];

let guolv_result = guolv.filter(item => {
  if (item % 3 == 0) {
    return true
  } else {
    return false
  }
})
console.log(guolv_result);
let arr3 = [
  { title: "男士衬衫", price: 75 },
  { title: "女式包", price: 58742 },
  { title: "男士包", price: 65 },
  { title: "女士鞋", price: 27531 },
];
let arr4 = arr3.filter(json => json.price > 10000);
console.log(arr4);
  • r ---reduce 汇总 reduce里面3个参数 总数,单独,次数
let huizong = [12, 69, 180, 8763];
let huizong2 = huizong.reduce((result2, item2, index) => {
  return result2 + item2;
})
console.log(huizong2);
let pingjun = huizong.reduce((result, item, index) => {
  if (index == huizong.length - 1) {
    return (result + item) / (index + 1);
  } else {
    return (result + item);
  }
})
console.log(pingjun);

(5)字符串方法

  • startsWith
  • endsWith
  • 字符串模板 ${}
let str = 'asdfghytridal';
let str1 = 123;
let str2 = `a${str1}`;
window.alert(str2);
alert(str.startsWith('asd'));
alert(str.endsWith("dal"));

(6) ES6面向对象

  • 多了class
  • 多了extends
  • 多了super
class User {
  constructor(name, pass) {
    this.name = name;
    this.pass = pass;
  }
  showName() {
    alert(this.name);
  }
  showPass() {
    alert(this.pass);
  }
}
class Vipuser extends User {
  constructor(name, pass, level) {
    super(name, pass); //继承了
    this.level = level;
  }
  showLevel() {
    alert(this.level);
  }
}

let u2 = new Vipuser('red', '1234', 2);
u2.showLevel();
u2.showName();
u2.showPass();
let u1 = new User('blue', '123456');
u1.showName();
u1.showPass();

(7)JSON

  • 第一个对象
    名字和值(key和value)一样的 留一个就行
  • 第二个简写
    可以去掉:function
 let a = 12;
let b = 13;
let json = { a, b };
console.log(json);
//方法开始
show:function(){}
show(){...}  //去掉了:和function
//3JSON标准格式 '{"a":1,"b":2}'

(8) Promise

  • promise必有then(成功执行的方法,失败执行的方法)
let p = new Promise((resolve, reject) => {
    //resolve 表示成功了
    //reject 表示拒绝了
    $.ajax({
      url: "js/arr.text",
      dataType: 'json',
      success(res) {
        resolve(res);
      },
      error(err) {
        reject(err);
      }
    })
  }).then(
    //第一个表示成功了调用 resolve 
    (arr) => {
      alert("成功了" + arr);
    },
    //第二个表示失败了回调 reject
    () => {
      alert("失败了");
    }
  )
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 看这本书是在markdown在做的笔记,更友好的阅读方式访问: github es6.md(https://git...
    汪汪仙贝阅读 478评论 0 0
  • 1、新的声明方式 以前我们在声明时只有一种方法,就是使用var来进行声明,ES6对声明的进行了扩展,现在可以有三种...
    令武阅读 1,046评论 0 7
  • 春天来了 春雨朦朦地下起来了, 夹着丝丝缕缕的春风。 春雨细细的, 密密的,灰蒙蒙的, 远处的树木、行人朦朦胧胧,...
    红色阳光阅读 584评论 0 1
  • #日记# 2018年4月9日 星期一 ️ 一 今年的第一批油菜花蜂蜜前几天已经陆续发出,昨天今天已经陆续收到好评。...
    刘元元阅读 247评论 0 0
  • Day2/21 6+麋鹿+北京 【书籍名称】《刻意练习》 【阅读心得】 1.大脑跟肌肉一样可以被锻炼,而且适应性会...
    麋鹿Mona阅读 139评论 0 0