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,
};
相关推荐
__不想说话__22 分钟前
面试官问我React组件和state的关系,我指了指路口的红绿灯…
前端·javascript·react.js
一个小潘桃鸭25 分钟前
需求:对表格操作列中的操作进行局部刷新
前端
番茄比较犟26 分钟前
Combine知识点switchToLatest
前端
北京_宏哥26 分钟前
🔥《爆肝整理》保姆级系列教程-玩转Charles抓包神器教程(15)-Charles如何配置反向代理
前端·面试·charles
Process29 分钟前
前端图片技术深度解析:格式选择、渲染原理与性能优化
前端·面试·性能优化
大松鼠君30 分钟前
轿车3D展示
前端·webgl·three.js
却尘31 分钟前
URL参数传递的两种方式:查询参数与路径参数详解
前端
下辈子再也不写代码了33 分钟前
分片下载、断点续传与实时速度显示的实现方法
前端·后端·github
婷婷婷婷34 分钟前
AntV X6 常用方法
前端
LucianaiB42 分钟前
拿到Offer,租房怎么办?看我用高德MCP+腾讯云MCP,帮你分分钟搞定!
前端·后端·cursor