ES6使用规则和常见使用方法

简介: ES6使用规则和常见使用方法

ES6使用规则和常见使用方法


let命令

let命令与var的区别

let命令作用域只局限于当前代码块

使用let声明的变量作用域不会被提前

在相同的作用域下不能声明相同的变量

for循环体中let的父子作用域 //for循环用let来定义变量


const命令

定义常用


数组的解构赋值


// 传统赋值
let a = 1;
let b = 2;
let c = 3;
// 在ES6 的语法中允许这样
let [a, b, c] = [1, 2, 3];
let [x, y] = [1, 2, 3];
    console.log(x) // 1
    console.log(y) // 2
let [a, [b], d] = [1, [2, 3], 4];
    console.log(a) // 1
    console.log(b) // 2
    console.log(d) // 4


箭头函数


箭头函数格式

格式1:(形参列表)=>{函数体}

格式2:var st=(形参列表)=>{ 函数体 }

// 箭头函数的书写方式
let fun = () => { console.log('hello'); }
fun()        //调用箭头函数
// 箭头函数的书写方式
let fun = (a,b) => {  
    return a+b;
}
fun(2,3)        //调用箭头函数
// 普通函数的书写方式
function fun() {
    console.log('hello')
}
fun()     //调用普通方法
// 普通函数的书写方式
function fun(a,b) {
    return a+b;
}
fun(2,3)     //调用普通方法


export 、import 命令


export导出

// 导出单个函数
export function multiply(x, y) {
    return x * y;
};
// 导出多个函数
function v1() { }
function v2() { }
export {
    v1, v2
};


import导入

u使用export命令定义了模块的对外接口以后,其他 JS 文件就可以通过import命令加载这个模块。

// 在main.js中
import {firstName, lastName, year} from './profile.js';
function setName(element) {
  element.textContent = firstName + ' ' + lastName;
}


uexport default 命令

为了给用户提供方便,不用阅读文档就能加载模块,就要用到export default命令,为模块指定默认输出。

// export-default.js文件
export default function () {
    console.log('foo');
}
// import-default.js文件
import customName from './export-default';
customName();  // 'foo'


相关文章
|
8月前
|
设计模式
ES6中新增Array.from()函数的用法详解
ES6中新增Array.from()函数的用法详解
82 1
|
8月前
|
编解码 JavaScript 前端开发
ES6 字符串的新增方法
ES6 字符串的新增方法
|
前端开发 API
ES 高级实战(四)查询 ES 数据
ES 高级实战(四)查询 ES 数据
1406 0
ES 高级实战(四)查询 ES 数据
ES6模板字符串的基本使用
ES6模板字符串的基本使用
|
8月前
|
网络架构
ES6函数新增了哪些扩展?
ES6函数新增了哪些扩展?
66 0
|
JavaScript 前端开发
ES6学习(四)—字符串的新增方法
ES6学习(四)—字符串的新增方法
|
JavaScript
ES6的基础用法
对js es6的用法进行简单介绍
|
网络架构
ES6中函数新增了哪些扩展?
ES6允许为函数的参数设置默认值
|
前端开发
前端学习笔记202306学习笔记第四十二天-Es8-ES8和ES9新增特性2
前端学习笔记202306学习笔记第四十二天-Es8-ES8和ES9新增特性2
75 0
|
前端开发
前端学习笔记202306学习笔记第四十二天-Es8-ES8和ES9新增特性1
前端学习笔记202306学习笔记第四十二天-Es8-ES8和ES9新增特性1
68 0

相关实验场景

更多