javascript中es6语法

es6语法简介：

// 1.历史：// 1995-----JavaScript诞生// 1997-----ECMAScript标准确立// 1999-----ES3出现，与此同时IE5风靡一时// 2009-----ES5出现，现在绝大所数使用的是ES5// 2015-----ES6/ECMAScript2015出现// 2.函数的Rest参数和扩展：----rest参数实际就是一种动态的参数，不知道外面传递多少个参数的时候可以说传入rest参数,语法...m,m是可以写成其他字母的。// 1.ES6中输出变量和循环的使用：function sum(...m){var sum = 0;for (var i of m){//----------ES6中 var * of m 循环sum += i;};console.log(`sum:${sum}`);//-----ES6中反引号里面${}可以输出变量的值};sum(1,2,3);//-----6//2.ES6中箭头函数使用：let sum2 = (...f)=>{//ES5中小括号就代表function，当函数体里面只有一行代码时，可以省略箭头后面的{}直接写，当为多行时，后面的{}不能省略。var sum = 0;for (var i of f){sum += i;};console.log(`sum:${sum}`);};sum2(2,3);//----5//3.数组的扩展：数组前面放三个点 ... 表示把数组拆分出来。// 1.简单拆分数组：console.log(...[1,2,3]);//------1,2,3// 2.合并多个数组：----实现concat() API功能var arr1 = [1,2]; [3,4]; var arr3 = [5,6];console.log([...arr1,...[3,4],...arr3]);//-------[1, 2, 3, 4, 5, 6]// 3.数组项前面加... 此项形参为一个数组，实参可以传递多个值，没有...时是一一对应的。var [x,y] = [2,5];console.log(y);//------5// ============================================//var [x,...y] = [2,5,6,7,8];console.log(y);//-------[5, 6, 7, 8]//4.后面接字符串:console.log(...'qwert');//-----q w e r t//============================================//var [x,...y] = 'qwert';console.log(y);//-------["w", "e", "r", "t"]// 3.Promise使用：------解决回调地狱，代码拥堵问题，演示：// 判断input是否传入大于5的参数，并随机产生一个奇数或者偶数案例：let input = function(x){// new 一个Promise对象，里面传入一个函数并returnreturn new Promise(function(resolve,reject){//resolve表示接口成功后执行的回调函数，reject表示接口报错后执行的回调函数let flag = x > 5 ? true : false;if (flag) {resolve({stat:0}) } else {reject({stat:1})}});};let inputs = ()=>{return new Promise((resolves,rejects)=>{var y = Math.floor(Math.random()*100);let flags = y % 2 == 0 ? true : false;if (flags) {resolves({stats:2});} else {rejects({stats:3})}})}// input此时接收到的是Promise返回的一个对象，可以点出属性then和catchinput(51).then((res)=>{//then属性表示接口成功后执行的回调函数，回调函数里面的参数实际就是resolve()里面的对象if (res.stat == 0) {console.log('输入的参数大于5');return inputs();//返回新的带有Promise函数的对象供下一个then和catch调用}}).catch((rej)=>{//catch属性表示接口失败后执行的回调函数，回调函数里面的参数实际就是reject()里面的对象if (rej.stat == 1) {console.log('输入的参数不大于5');return inputs();//返回新的带有Promise函数的对象供下一个then和catch调用}}).then((ress)=>{if (ress.stats==2) {console.log('并随机产生了一个偶数')}}).catch((rejs)=>{if (rejs.stats==3) {console.log('并随机产生了一个奇数')}})// Promise提供了一个方法：.all()可以同时发多个请求：Promise.all([input(),inputs()]).then(([res1,res2])=>{console.log(`result1:${res1.stat},result2:${res2.stats}`)})// 4.Common.js中和ES6中导入导出模块区别：// 1.export default {name:'app'}-------ES6中默认导出一个模块// export var obj = '声明式'  或者 var obj = '声明式'  ， export {obj}---------声明式导出//module.exports = {name:'app'}------ common.js导出一个模块// 2.import uter from './uter' -----ES6默认导入模块// import {obj1,obj2,obj3} from './module' -----ES6声明式导入模块//var uter = require('./uter')---common.js导入模块// 3.import和export只能在顶级作用域执行，其他作用域会报错，这里介绍全体导入：// import * as obj from './test.js' ------此导入方式返回的是一个导入模块的对象// 5.AMD、CMD、CommonJS、和ES6对比：// 1.AMD、CMD、CommonJS是模块化开发的标准，规范。// 1.AMD是RequireJS在推广过程中对模块定义的规范化产出,是一个异步模块定义。define(['package/lib'],function(lib){function foo(){lib.log('hello world!')};return {foo:foo};});// 2.CMD是SeaJS在推广过程中对模块定义的规范化产出，是个同步模块定义。define(function(require,exports,module){var $ = require('jquery');var Spinning = require('./spinning');})// 3.CommonJS规范通过-module.exports定义的，前端浏览器不支持module.exports，在node后端使用// 6.对象属性的声明：// 1.变量的简写var person = {name, //--------当name的属性值和name属性一样时，可以简写，这里即表示 name:namesex:1,age:15}// 2.函数的简写：var play = {add:function(x){return x;},add2(x){  //-----函数声明简写为：函数名(){ 函数体 }return x;}}

提示：本文图片等素材来源于网络，若有侵权，请发邮件至邮箱：810665436@qq.com联系笔者删除。
笔者：苦海

javascript中es6语法相关推荐

.vue文件在webstorm中es6语法报错解决方法
.vue文件在webstorm中es6语法报错解决方法参考文章: (1).vue文件在webstorm中es6语法报错解决方法 (2)https://www.cnblogs.com/yuqing6/ ...
带你一文读懂Javascript中ES6的Symbol
带你一文读懂Javascript中ES6的Symbol 前言基础类型 Symbol Symbol.for 与 Symbol.keyFor Symbol.iterator Symbol.search ...
JavaScript (11) ES6语法
1. ES6 语法 ECMAScript 6 是继ECMAScript 5 之后发布的JavaScript 语言的新一代标准,加入了很多新的特性和语法,该标准于2015年6月17日发布了正式版本,并被 ...
JavaScript中的语法糖是什么？
专业的解释在计算机科学中,语法糖(syntactic sugar)是指编程语言中可以更容易的表达一个操作的语法,它可以使程序员更加容易去使用这门语言:操作可以变得更加清晰.方便,或者更加符合程序员的 ...
JavaScript之ES6语法
目录 1.变量的使用 (1)let的使用 (2)const的使用 2.解构赋值 (1) 数组解构 (2)对象解构 3.箭头函数 (1)箭头函数的写法 (2)箭头函数的this指向问题 4.三点运算符 ...
js 正则中冒号代表什么_javascript中正则表达式语法详解
好久都没有写博客了,主要是太懒了,尤其是在阳春三月,风和日丽的日子,太阳暖暖的照在身上,真想美美的睡上一觉.就导致了这篇博客拖到现在才开始动笔,javascript的正则这一块也不是什么新的东西,主要 ...
学习webpack4 - ES6语法转化
学习webpack4 - 基础配置学习webpack4 - HTML处理学习webpack4 - 样式处理学习webpack4 - ES6语法转化学习webpack4 - 第三方库的使用学习 ...
【面试需要】掌握JavaScript中的this，call，apply的原理
作者 | Jeskson 掘金 | https://juejin.im/user/5a16e1f3f265da43128096cb 2020年01月10日前言,为什么要学习在掌握JavaScri ...
javascript中实例对象和构造函数关系、原型语法、原型链、call实现继承、apply调用函数、bind拷贝函数、拷贝继承、class类、super、严格模式、高阶函数、闭包、递归、es6简介
实例对象和构造函数的关系及原型: 实例对象是通过构造函数创建出来的,实例对象的构造器constructor就是指向构造函数的:每个实例对象中的同一方法的指向是各不相同的,但是其属性值相同的属性可以相同 ...

javascript中es6语法

javascript中es6语法相关推荐

最新文章

热门文章