003-ES6常用语法

ES6常用语法

let、const

💡 Tips:不可重复声明,const不可改,块级作用域限制

javascript 复制代码
let name1 = 'zhangsan';
const AGE = 10;

模板字符串

javascript 复制代码
const info = `my name is ${name1}, i am ${AGE}`;

属性简写、方法简写

javascript 复制代码
const obj1 = {
  name1,
  run() {
    console.log('i can run !');
  },
};

箭头函数

javascript 复制代码
const arr = [1, 2, 3, 4];
arr.forEach((item, i) => {
  console.log(`arr索引为:${i}, 值为:${item}`);
});

promise

💡 Tips:解决回调地狱,异步请求

javascript 复制代码
const p = new Promise((resolve, reject) => {
  setTimeout(() => {
    if (Math.random() > 0.5) {
      resolve('succeed');
    } else {
      reject('failed');
    }
  }, 3000);
});
p.then(res => {
  console.log('promise success --', res);
}).catch(err => {
  console.log('promise fail --', err);
});

async、await

💡 Tips:对 promise 的优化写法,更清晰

javascript 复制代码
function main() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('main 内部方法');
      resolve('main 执行成功');
    }, 3000);
  });
}

async function getMain() {
  const data = await main();
  console.log('getMain 方法执行', data);
}
getMain();
console.log('外部方法');

解构赋值

javascript 复制代码
let { name, age } = {
  name: 'zhangsan',
  age: 12,
};
let [arr1, arr2] = [2, 3];

import、export

javascript 复制代码
import { mapMutations } from 'vuex';

export const fn = (data) => {};

扩展运算符

💡 Tips:对象合并

javascript 复制代码
const obj = {
  name: 'zhangsan',
  age: 19,
};

const obj3 = {
  ...obj,
  age: 10,
};
相关推荐
佳腾_几秒前
【Web应用服务器_Tomcat】二、Tomcat 核心配置与集群搭建
java·前端·中间件·tomcat·web应用服务器
brzhang31 分钟前
代码即图表:dbdiagram.io让数据库建模变得简单高效
前端·后端·架构
三巧41 分钟前
纯CSS吃豆人(JS仅控制进度)
javascript·css·html
SummerGao.43 分钟前
【解决】layui layer的提示框,弹出框一闪而过的问题
前端·layui
软件技术NINI1 小时前
html css js网页制作成品——HTML+CSS+js美甲店网页设计(5页)附源码
javascript·css·html
天天扭码1 小时前
从数组到对象:JavaScript 遍历语法全解析(ES5 到 ES6 + 超详细指南)
前端·javascript·面试
拉不动的猪1 小时前
前端开发中常见的数据结构优化问题
前端·javascript·面试
街尾杂货店&1 小时前
css word
前端·css
Мартин.1 小时前
[Meachines] [Hard] CrimeStoppers LFI+ZIP-Shell+Firefox-Dec+DLINK+rootme-0.5
前端·firefox
冰镇生鲜1 小时前
快速静态界面 MDC规则约束 示范
前端