ES6基础

作者: 崔某猿 | 来源:发表于2019-07-23 16:47 被阅读0次

新的变量声明方式

与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升。
使用let来声明一个值会被改变的变量,而使用const来声明一个值不会被改变的变量,也可以称之为常量。


箭头函数的使用

// es5
var fn = function(a, b) {
    return a + b;
}

// es6 箭头函数写法,当函数直接被return时,可以省略函数体的括号
const fn = (a, b) => a + b;

箭头函数中没有this。如果你在箭头函数中使用了this,那么该this一定就是外层的this。


模板字符串

// es5
var a = 20;
var b = 30;
var string = a + "+" + b + "=" + (a + b);

// es6
const a = 20;
const b = 30;
const string = `${a}+${b}=${a+b}`;

使用 `` 将整个字符串包裹起来,而在其中使用 ${} 来包裹一个变量或者一个表达式。


解析解构

const props = {
    className: 'tiger-button',
    loading: false,
    clicked: true,
    disabled: 'disabled'
}
// es5
var loading = props.loading;
var clicked = props.clicked;

// es6
const { loading, clicked } = props;

扩展运算符

const arr1 = [1, 2, 3];
const arr2 = [...arr1, 10, 20, 30];

本人学识有限 文章多有不足

若有错误 请大方指出 以免误导他人

相关文章

  • ES6基础语法

    ES6基础语法

  • JavaScript进阶

    一、ES6基础 1. ECMAScript 6 简介 ECMAScript(ES6) 是JavaScript语言的...

  • <ES6>总结:知识点

    一、ES6基础: 1、ES6的配置: 在WebStorm中,打开设置,按照如下,找到JavaScript:Lang...

  • 数组去重

    基础类型数组去重 ES5 ES6 复杂类型数组去重 ES5 ES6

  • es6基础知识3(迭代)

    title: es6基础知识3(迭代)tags: 迭代categories: 前端 1. 迭代器 es6中新增了迭...

  • webpack 4.0 基础配置

    基础配置主要包括: webpack 基础配置安装 webpack 打包后的配置 html 插件 样式处理 es6 ...

  • react基础入门:(一)原生JS基础测试

    原文链接:react基础入门:(一)原生JS基础测试 以下问题都是以es6为基础 一 基础 有哪些数据类型? 字符...

  • 来,用ES6写个Promise吧

    本文采用es6语法实现Promise基本的功能, 适合有javascript和es6基础的读者,如果没有,请阅读 ...

  • es6-selfnote

    ECMAScript6(ES6)基础知识及核心原理 使用Babel编译ES6 一、下载安装Babel环境:需要电脑...

  • ES6入门基础

    ES6入门基础 一.let & const 1.基本用法 es6新增 let命令,用来申明变量,用法类似于var,...

网友评论

      本文标题:ES6基础

      本文链接:https://www.haomeiwen.com/subject/pqiolctx.html