(十二)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("失败了");
    }
  )