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联系笔者 删除。
笔者:苦海

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/575294.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

react 导航条选中颜色_调整安卓手机的颜色以更好地查看一切

并非所有人都有相同的区分颜色的能力。我们对屏幕上色彩配置的需求甚至口味可能会因人而异。幸运的是,Android为我们提供了多种本地工具,能够调整手机的颜色。我们的手机显示数百万种音调,这些音调是由屏幕配置或终端如何解释从某些应用程序接…

vue项目目录结构分析、过滤器、vue文件中基础template、script、style

项目目录结构: 1.在一个项目中一般的目录结构为:my_project------------项目文件夹|____src--------------------------------存放人可以看懂的源代码,具备一定功能划分,mvc思想|____dist-------------------------------存放真实…

linux进程调度之 FIFO 和 RR 调度策略

转载 http://blog.chinaunix.net/uid-24774106-id-3379478.html linux进程调度之 FIFO 和 RR 调度策略 2012-10-19 18:16:43分类: LINUX 作者:manuscola.beangmail.com 博客地址:bean.blog.chinaunix.net 最近花了10几天的时间&#xff0…

echarts 获取点击的y轴数值_有机磷酸催化对醌的不对称直接加成反应合成轴手性芳基醌类化合物...

有机磷酸催化对醌的不对称直接加成反应合成轴手性芳基醌类化合物本文作者:Summer轴手性联芳基二醇骨架广泛存在于天然产物、生物活性分子、有用的手性配体以及催化剂中(Figure 1a),因此,轴手性联芳基二醇化合物的合成受到广泛关注且已经取得了…

vue中自定义指令、组件化、生命周期、节流和防抖、获取DOM、mint-ui简介、过渡和动画

自定义指令&#xff1a; vue中通过directive方法自定义指令&#xff0c;如&#xff1a;自定义一个v-focus指令&#xff1a; <script>Vue.directive(focus, {//通过directive(指令名,{配置})注册全局指令inserted: function (el) {//inserted:表示当自定义指令插入元素后…

H264解码的一个測试程序

网上看到的一个H264视频格式的解码測试程序&#xff0c;能够用来參考其逻辑流程。 代码例如以下&#xff1a; Test_Display_H264(){ in_fd open(H264_INPUT_FILE, O_RDONLY); //video file open fstat(in_fd, &s); …

spring框架 web开发_go语言web开发框架学习:Iris框架讲解(一)

Golang介绍Go语言是谷歌推出的一种全新的编程语言&#xff0c;可以在不损失应用程序性能的情况下降低代码的复杂性。谷歌首席软件工程师罗布派克(Rob Pike)说&#xff1a;我们之所以开发Go&#xff0c;是因为过去10多年间软件开发的难度令人沮丧。谷歌资深软件工程师罗布派克(R…

vue-router路由、mixin混入、vue-resource、axios、计算属性watch、moment.js、vuex、vue-cli、数据双向绑定、搭建vue环境、vue实例、配置启动项

路由vue-router介绍: // 1.前端路由核心&#xff1a;锚点值的改变&#xff0c;根据不同的锚点值&#xff0c;渲染指定dom位置的不同数据。// 2.vue中&#xff0c;模板数据不是通过ajax请求的&#xff0c;而是调用函数获取到模板内容// 3.vue-router使用方式&#xff1a;// 1.下…

最小路径覆盖,最小点覆盖,最大独立点集(转)

来自&#xff1a;http://blog.csdn.net/l04205613/article/details/6278394 node 1&#xff1a;最小路径覆盖 在一个&#xff30;&#xff38;&#xff30;的有向图中&#xff0c;路径覆盖就是在图中找一些路经&#xff0c;使之覆盖了图中的 所有顶点&#xff0c;且任何一个顶…

iOS中画矩形的几种方法总结

方法1&#xff1a; #pragma mark 画矩形方法1void drawRect1(){ // 1取得图形上下文 CGContextRef ctx UIGraphicsGetCurrentContext(); // 2画一条线段 // 设置一个起点 CGContextMoveToPoint(ctx, 20, 20); CGContextAddLineToPoint(ctx, 100, 10…

linux终端的背景_如何在终端显示图像缩略图 | Linux 中国

lsix 是一个简单的命令行实用程序&#xff0c;旨在使用 Sixel 图形格式在终端中显示缩略图。-- Sk不久前&#xff0c;我们讨论了 Fim[1]&#xff0c;这是一个轻量级的命令行图像查看器应用程序&#xff0c;用于从命令行显示各种类型的图像&#xff0c;如 bmp、gif、jpeg 和 png…

移动App开发、App和Web区别、开发移动app时技术选型

移动App开发 混合移动App: 移动端App开发有Android和iOS及混合App,开发它们采用不同的语言,如: 苹果软件使用: OC、或者Swift语言开发。 安卓软件使用:Java,安卓控件进行开发。 混合App使用:把前端特有的技术(HTML+CSS+JS)通过某种方式移植到移动App开发上,这种…

多线程下HttpContext.Current 的问题

在项目中需要记录文本日志&#xff0c;为了加快响应速度所以用到了多线程。 但是以前的方法是不支持多线程的&#xff0c;程序运行错误。 追踪代码发现提示HttpContext为空。 1.HttpContext.Current表示当前HttpRequest 对应的Context对象 httpContext.current在不同的httpRe…

混合App开发,HBuilder开发移动App

使用HBuilder开发混合App&#xff1a; Hbuilder&#xff1a;是一个在线打包工具&#xff0c;不需要在本地配置开发环境&#xff1b;直接将做好的网站&#xff0c;通过一些简单的操作&#xff0c;就能在线打包为一个App&#xff1b; 混合APP开发常见技术&#xff1a;Html5、Re…

fanuc roboguide_ROBOGUIDE软件:机器人产线输送带输送物料虚拟仿真操作

概述输送带在机器人生产线或工作站中是常见的物料传送设备&#xff0c;它能够将物料从一个工位自动传送到另一个工位&#xff0c;是实现自动化生产制造必不可少的装置设备之一。虚拟仿真是对真实的工业机器人生产线或工作站的图形化再现&#xff0c;因此&#xff0c;对于具有输…

ZOJ 3209

精确覆盖 #include <iostream> #include <cstdio> #include <cstring> #include <algorithm> #include <vector> using namespace std;const int maxn920; const int maxnode920*550; const int maxr550; int ans; struct DLX {int n , sz; …

webpack上线版(生产环境中推荐使用)

配置上线版&#xff08;生产环境&#xff09;webpack&#xff1a; 实际中将开发环境中和生产环境中打包配置是分开的&#xff0c;两者本质没太大区别&#xff0c;只是生产环境中的webpack打包配置要更加优化合理&#xff0c;下面将具体介绍一下生产环境中webpack配置文件&…

双电阻差分电流采样_小小的采样电阻,还真有点门道!

电流检测电阻的基本原理根据欧姆定律,当被测电流流过电阻时,电阻两端的电压与电流成正比.当1W的电阻通过的电流为几百毫安时,这种设计是没有问题的.然而如果电流达到10-20A,情况就完全不同,因为在电阻上损耗的功率(PI2xR)就不容忽视了.我们可以通过降低电阻阻值来降低功率损耗,…

jpa in查询_优选在shopee虾皮怎么发货价格查询皮皮虾云仓

优选在shopee虾皮怎么发货价格查询皮皮虾云仓皮皮虾云仓物流系统为现代化管理系统&#xff0c;可集中化&#xff0c;高效化的处理本土店物流订单。物流系统可对接主流的的电商平台ERP可以实现高效的订单处理。如lazada&#xff0c;shopee&#xff0c;1688、速卖通、eaby、shopi…

html5+、ReactNative、Weex、Ionic之间的区别、(配置java、python、Android环境)、ReactNative(react-native-cli)、yarn、Weex

html5、ReactNative、Weex、Ionic之间的区别&#xff1a; html5和Ionic&#xff1a; 在开发原理上基本相同&#xff0c;都是需要先开发出一个完整的网站&#xff0c;再通过html5或Ionic提供的打包技术对网站进行打包成移动app&#xff0c;它们实际还是一个网站&#xff0c;并非…