ES6

2023-04-17 15:40| 来源: 网络整理| 查看: 265

ES6概述 ECMAScript6.0（简称：ES6）是JavaScript语言的下一代标准，在2015年6月正式发布目标：使得JavaScript语言可以用来编写复杂大型的应用程序，成为企业级的开发语言 ES6编程基础let命令使用let声明的变量，只在代码块中有效（代码块作用域） let命令没有变量提升暂时性死区：只要块级作用域存在let命令，它所声明的变量就“绑定”在这个区域，不再受外界影响 const命令 const命令声明一个常量，一旦声明，值不能被改变必须在声明的同时赋予初始值函数的扩展–rest参数（剩余参数）

语法格式：

function 函数名(命名参数,...剩余参数名){ }

剩余参数：不与任何命名参数相比配的其他参数

案例：

function add(sum,...args){ for(n of args){ sum += n; } console.log(sum); } let sum = 10; add(sum,1,2,3,4); 解构赋值

使用解构赋值可以轻松地使用模板从对象或数组中提取数据

好处：一次可以定义多个变量，并赋值初始值

对象解构

可以一次性的将每个属性赋予给同名变量

//同名 let stu = {name:"tom",age:20}; let {name,age} = stu; console.log(name,age); //不同名 let stu = {name:"tom",age:20}; let {name:stuName,age:stuAge} = stu; console.log(stuName,stuAge); 数组解构var arr = ["tom","marry","scott"]; var [a,b,c] = arr; console.log(a,b,c); 增强版的对象字面量var name ="marry"; var stu = { name,//属性的简写形式，将同名变量的值赋予给属性 age:20, //方法的简写形式 hi(){ alert("hi") } } console.log(stu.name); stu.hi(); 箭头函数

箭头函数：是ES6中函数表达式定义的一种简化写法

ES6中允许使用“箭头” (=>)定义函数

/* var fun1 = function(a){ return a + 1; } */ //var fun1 = (a)=>{return a+1;} var fun1 = a => a + 1 var result = fun1(1); console.log(result);

注意：

当方法的形参个数为1的时候，形参外的括号可以省略

当方法体中只有一条 return语句的时候，方法体外的大括号可以省略，return关键字也可以省略

箭头函数在被调用的时候，不会向其传递隐式的 arguments 和 this 对象

箭头函数的函数体内的this对象，就是定义箭头函数时所在的对象，而不是调用时的对象

对象扩展运算符（…）：用于取出参数对象中的所有可遍历的属性，拷贝到当前对象中

var stu = {"name":"tom","age":20}; var stu2 = {...stu}; stu2.name = "marry"; console.log(stu.name); console.log(stu2.name);

数组扩展运算符:

var arr = [1,2,3,4,5]; var arr2 = [...arr]; arr[0] = 10; console.log(arr2); 模块

ES6模块的主要思想是必须显示地使用标识符导出模块数据，才能从外部访问模块

导入导出方式一：要求导入时使用导出时候的名称

//1.js export var name = "tom"; import {name} from './js/1.js' console.log(name) //1.js function test1(){ alert('test1') } //导出方法 export {test1} import {test1} from "./js/1.js"; test1()

默认导出导入

//1.js export default { name:"tom" } import Stu from './js/1.js' console.log(Stu.name)

全部导入

//1.js export var name = "tom"; export default { name:"tom" } function test1(){ alert('test1') } //导出方法 export {test1} import Stu from './js/1.js' import * as app from './js/1.js' console.log(Stu.name) console.log(app.name) console.log(app.default.name) app.test1()

【本文地址】

ES6

ES6

今日新闻

推荐新闻