ES6-简介、语法
ES6
ES6简介
ECMAScript 6（简称ES6）是于2015年6月正式发布的JavaScript语言的标准，正式名为ECMAScript 2015（ES2015）。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言 [1] 。
1.优点
- 提升JS编写大型的复杂应用程序的能力（这次升级加入了模块化的概念、细化和优化语法、封装了一些方法）。
2.不足
- 对浏览器存在兼容性问题，可以使用Bable：ES6->ES5（转换器）
ES6语法
1.let声明变量
- let申明的变量是有局部作用域
- let声明的变量不能跟已有变量重名
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>{//let申明的变量是有局部作用域let a = 1;//console.log(a);}//let声明的变量不能跟现有变量重名let b = true;//let b = false;console.log(b);</script>
</head>
<body></body>
</html>
2.const声明常量
- 常量必须初始化
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>const PI = 3.14;//PI = 3.1415; //Assignment to constant variable//常量必须初始化const A = 1;</script>
</head>
<body></body>
</html>
3.解构赋值
解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>//数组的解构let a = 1,b = true,c = "abc";let [x,y,z] = [2,false,"bcd"];let res = a + x;console.log(x,y,z);//对象的解构let sid = 1,sname = "mary";let student1 = {"sid":sid,"sname":sname};console.log(student1);let student2 = {sid,sname};console.log(student2);let teacher = {"tid":1,"tname":"张雪峰"};// let id = teacher.tid;// let name = teacher.tname;//变量名必须与属性名一致let {tname,tid} = teacher;console.log(tname,tid);</script>
</head>
<body></body>
</html>
4.模板字符串
模板字符串相当于加强版的字符串，用反引号 `,除了作为普通字符串，还可以用来定义多行字符串，还可以在字符串中加入变量和表达式。
- 定义多行字符串
- 引用变量
- 调用函数
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>//使用模板字符串定义多行字符串let str1 = `hello world`;console.log(str1);//模板字符串引用变量let name = "mary";let str2 = `hello ${name}`;console.log(str2);//模板字符串调用函数function show() {return "tom";}let str3 = `hello ${show()}`;console.log(str3);</script>
</head>
<body></body>
</html>
5.定义方法简写
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>let student1 = {sid:1,sname:"mary",sleep:function(){console.log("睡觉");},eat:function(){console.log("吃饭");}};student1.sleep();let student2 = {sid:1,sname:"tom",sleep(){console.log("睡觉");},eat(){console.log("吃饭");}};student2.eat();</script>
</head>
<body></body>
</html>
6.对象拓展运算符
- 拓展运算符：（…），用于取出参数对象所有可遍历属性然后拷贝到当前对象
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>let teacher1 = {"tid":1,"tname":"张雪峰"};let teacher2 = {...teacher1};console.log(teacher2);let stu1 = {"sid":1},stu2 = {"sname":"mary"},stu3 = {"sage":18};let student = {...stu1,...stu2,...stu3};console.log(student);</script>
</head>
<body></body>
</html>
7.函数的默认参数
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>function show(a,b=10){let res = a + b;console.log(res);}show(1,2);show(1);</script>
</head>
<body></body>
</html>
8.不定参数
不定参数用来表示不确定参数个数，形如，…变量名，由…加上一个具名参数标识符组成。具名参数只能放在参数列表的最后，并且有且只有一个不定参数。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>function show(a,...b){console.log(b.length);}show(1);show(2,true);show(3,4.2,"abc",true);</script>
</head>
<body>
</body>
</html>
9.箭头函数
箭头函数提供了一种更加简洁的函数书写方式。基本语法是：参数 => 函数体
- 无参的箭头函数必须在参数的地方写()
- 一个参数的箭头，例：res = >
- 有多个参数的箭头函数必须在参数的地方写()
- 函数体有多行语句时需要将{}写出来
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>function show(a) {return a;}//console.log(show(1));//箭头函数let showAgain = b => b;//console.log(showAgain(2));function f1() {console.log("Hello World");}f1();//无参的箭头函数必须在参数的地方写()let f2 = () => console.log("Hello World");f2();function f3(a,b) {var res = a + b;return res;}console.log(f3(3,4));//有多个参数的箭头函数必须在参数的地方写()//函数体有多行语句时需要将{}写出来let f4 = (x,y) => {var res = x + y;return res;}console.log(f4(3,4));</script>
</head>
<body>
</body>
</html>
相关文章：
ES6-简介、语法
ES6 ES6简介 ECMAScript 6（简称ES6）是于2015年6月正式发布的JavaScript语言的标准，正式名为ECMAScript 2015（ES2015）。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语…...
诚迈科技子公司智达诚远与Unity中国达成合作，打造智能座舱新时代
2023 年 8 月 23 日，全球领先的实时 3D 引擎 Unity 在华合资公司 Unity 中国举办发布会，正式对外发布 Unity 引擎中国版——团结引擎，并带来专为次世代汽车智能座舱打造的团结引擎车机版。发布会上，诚迈科技副总裁、诚迈科技子公司…...
算法与数据结构（十）--图的入门
一.图的定义和分类 定义：图是由一组顶点和一组能够将两个顶点连接的边组成的。 特殊的图： 1.自环：即一条连接一个顶点和其自身的边; 2.平行边：连接同一对顶点的两条边； 图的分类： 按照连接两个顶点的边的…...
【Go 基础篇】Go语言 init函数详解：包的初始化与应用
介绍 在Go语言中，init() 函数是一种特殊的函数，用于在包被导入时执行一次性的初始化操作。init() 函数不需要手动调用，而是在包被导入时自动执行。这使得我们可以在包导入时完成一些必要的初始化工作，确保包的使用具有正确的环境…...
wazuh环境配置及漏洞复现
目录 一、wazuh配置 1进入官网下载OVA启动软件 2.虚拟机OVA安装 二、wazuh案例复现 1.wazuh初体验 2.这里我们以SQL注入为例，在我们的代理服务器上进行SQL注入，看wazuh如何检测和响应 一、wazuh配置 1进入官网下载OVA启动软件 Virtual Machine (O…...
Java接收前端请求体方式
💗wei_shuo的个人主页 💫wei_shuo的学习社区 🌐Hello World ！ 文章目录 RequestBodyPathVariableRequestParamValidated方法参数校验方法返回值校验 RequestHeaderHttpServletRequest ## Java接收前端请求体的方式 请求体…...
私有化部署即时通讯平台，30分钟替换钉钉和企业微信
随着企业对即时通讯和协作工具的需求不断增长，私有化部署的即时通讯平台成为企业的首选。WorkPlus作为有10余年行业深耕经验与技术沉淀品牌，以其安全高效的私有化部署即时通讯解决方案，帮助企业在30分钟内替换钉钉和企业微信。本文将深入探讨…...
如何深入理解 Node.js 中的流（Streams）
Node.js是一个强大的允许开发人员构建可扩展和高效的应用程序。Node.js的一个关键特性是其内置对流的支持。流是Node.js中的一个基本概念，它能够实现高效的数据处理，特别是在处理大量信息或实时处理数据时。 在本文中，我们将探讨Node.js中的流…...
MSP430FR2xxx开发（一）添加driverlib
一、新建工程 根据自己手上的硬件型号新建工程，文中已MSP430FR2355为例。 二、添加driverlib 首先去官方下载driverlib. https://www.ti.com.cn/tool/cn/MSPDRIVERLIB?keyMatchMSP430%20DRIVERLIB#downloads 下载后的内容如下： 我这里就选择MSP430…...
【C++】做一个飞机空战小游戏(九)——发射子弹的编程技巧
[导读]本系列博文内容链接如下： 【C】做一个飞机空战小游戏(一)——使用getch()函数获得键盘码值 【C】做一个飞机空战小游戏(二)——利用getch()函数实现键盘控制单个字符移动【C】做一个飞机空战小游戏(三)——getch()函数控制任意造型飞机图标移动 【C】做一个飞…...
34.SpringMVC获取请求参数
SpringMVC获取请求参数 通过ServletAPI获取 将HttpServletRequest作为控制器方法的形参，此时HttpServletRequest类型的参数表示封装了当前请求的请求报文的对象 index.html <form th:action"{/test/param}" method"post">用户名&#…...
TC1016-同星4路CAN（FD），2路LIN转USB接口卡
TC1016是同星智能推出的一款多通道CAN（FD）和LIN总线接口设备，CANFD总线速率最高支持8M bps，LIN支持速率0~20K bps，产品采用高速USB2.0接口与PC连接，Windows系统免驱设计使得设备具备极佳的系统兼容性。 支…...
Android源码——从Looper看ThreadLocal
1 概述 ThreadLocal用于在当前线程中存储数据，由于存储的数据只能在当前线程内使用，所以自然是线程安全的。 Handler体系中，Looper只会存在一个实例，且只在当前线程使用，所以使用ThreadLocal进行存储。 2 存储原理 …...
16、Flink 的table api与sql之连接外部系统: 读写外部系统的连接器和格式以及JDBC示例（4）
Flink 系列文章 1、Flink 部署、概念介绍、source、transformation、sink使用示例、四大基石介绍和示例等系列综合文章链接 13、Flink 的table api与sql的基本概念、通用api介绍及入门示例 14、Flink 的table api与sql之数据类型: 内置数据类型以及它们的属性 15、Flink 的ta…...
MySQL 自定义 split 存储过程
MySQL 没有提供 split 函数，但可以自己建立一个存储过程，将具有固定分隔符的字符串转成多行。之所以不能使用自定义函数实现此功能，是因为 MySQL 的自定义函数自能返回标量值，不能返回多行结果集。 MySQL 8： drop pr…...
专题-【十字链表】
有向图的十字链表表示法：...
微信小程序教学系列（2）
第二章：小程序开发基础 1. 小程序页面布局与样式 在小程序开发中，我们可以使用 WXML（WeiXin Markup Language）和 WXSS（WeiXin Style Sheet）来定义页面的布局和样式。 1.1 WXML基础 WXML 是一种类似于 H…...
社科院与美国杜兰大学金融管理硕士项目——畅游于金融世界
随着社会经济的不断发展，职场竞争愈发激烈，很多同学都打算通过报考研究生来实现深造，提升自己的综合能力和竞争优势，获得优质的证书。而对于金融专业的学生和在职人员来说，社科院与美国杜兰大学金融管理硕士项目是一个…...
功能强大、超低功耗的STM32WL55JCI7、STM32WL55CCU7、STM32WL55CCU6 32位无线远距离MCU
STM32WL55xx 32位无线远距离MCU嵌入了功能强大、超低功耗、符合LPWAN标准的无线电解决方案，可提供LoRa、(G)FSK、(G)MSK和BPSK等各种调制。STM32WL55xx无线MCU的功耗超低，基于高性能Arm Cortex-M4 32位RISC内核（工作频率高达48MHz）…...
【自适应稀疏度量方法和RQAM】疏度测量、RQAM特征、AWSPT和基于AWSPT的稀疏度测量研究（Matlab代码实现）
💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势：🌞🌞🌞博客内容尽量做到思维缜密，逻辑清晰，为了方便读者。 ⛳️座右铭&a…...
sql递归查询
一、postgresql 递归sql with recursive p as(select t1.* from t_org_test t1 where t1.id2union allselect t2.*from t_org_test t2 join p on t2.parent_idp.id) select id,name,parent_id from p; sql中with xxxx as () 是对一个查询子句做别名，同时数据库会对…...
常见前端面试之VUE面试题汇总三
7. Vue 中封装的数组方法有哪些，其如何实现页面更新 在 Vue 中，对响应式处理利用的是 Object.defineProperty 对数据进 行拦截，而这个方法并不能监听到数组内部变化，数组长度变化，数 组的截取变化等，所以需…...
Three.js 实现模型材质分解，拆分，拆解效果
原理：通过修改模型材质的 x,y,z 轴坐标 positon.set( x,y,z) 来实现拆解，分解的效果。 注意：支持模型材质position 修改的材质类型为 type“Mesh” ,其他类型的材质修改了position 可能没有实际效果 在上一篇 Three.js加载外部glb,fbx,gltf…...
《JVM修仙之路》初入JVM世界
《JVM修仙之路》初入JVM世界 博主目前正在学习JVM的相关知识，想以一种不同的方式记录下，娱乐一下 清晨，你睁开双眼，看到刺眼的阳光，你第一反应就是完了完了，又要迟到了。刚准备起床穿衣的你突然意识到不对&…...
苍穹外卖 day1 搭建成功环境
引入 idea找不到打包生成的文件目录怎么办，首先点击这个小齿轮 show ecluded files然后就能找到隐藏的文件 这个jar包内含tomcat，可以直接丢在linux上用 开发环境：开发人员在开发阶段使用的环境，一般外部用户无法访问 测试环…...
智能主体按照功能划分
(1) 构件接口主体 构件接口主体提供构件与用户之间的接口。当一个用户通过代理主体向 元组空间提出申请，并找到相匹配的构件主体时，此构件主体会将其所在构件主体 组中的构件接口主体通过申请用户的代理主体传送到用户的界面。 (2) 构件主体 通过构…...
python中的matplotlib画折线图（数据分析与可视化）
先导包（必须安装了numpy 、pandas 和matplotlib才能导包）： import numpy as np import pandas as pd import matplotlib.pyplot as plt核心代码： import numpy as np import pandas as pd import matplotlib.pyplot as pltpd.se…...
大数据数据仓库
一.在线教育 1.数据采集 1.数仓概念 数据仓库是为企业制定决策，提供数据支持的。数据采集和存储、对数据进行计算和分析 2.项目架构 2.数据分类 业务数据 用户行为数据 爬虫数据 2.离线数仓 3.实时数仓...
Java“牵手“速卖通商品详情页面数据获取方法,速卖通API实现批量商品数据抓取示例
速卖通商城是一个网上购物平台，售卖各类商品，包括服装、鞋类、家居用品、美妆产品、电子产品等。要获取速卖通商品详情数据，您可以通过开放平台的接口或者直接访问速卖通商城的网页来获取商品详情信息。以下是两种常用方法的介绍：…...
【Git】代码误推送还原（真实项目环境，非纸上谈兵）
背景 RT， 我今天眼睛花了，不小心把工作分支【合并】到了一个不相干的功能分支上，并且代码已经推送到远程仓库了。于是，只能尝试还原到上一次提交中。 【合并】分支有一个点我们是不可避免的，文字很难描述，…...
网站收录提交接口/产品seo优化
配置文件位置： 1.linux ~/.pip/pip.conf 2.windows %HOME%\pip\pip.ini 配置文件内容：[global] index-url http://pypi.douban.com/simple 注：optional，以下也可以加到上边所示的配置文件中。 1. trusted-host pypi.douban.co…...
建设网站的税点是多少/网站关键词怎么写
摘要：RDD：弹性分布式数据集，是一种特殊集合 ‚ 支持多种来源 ‚ 有容错机制 ‚ 可以被缓存 ‚ 支持并行操作，一个RDD代表一个分区里的数据集 RDD有两种操作算子：Transformation（转换）࿱…...
高端企业网站建设公司/网络优化的意义
填空1、Linux桌面环境主要包括KDE和(GNOME)2、某文件的权限为：d-rw-_r--_r-，用数值形式表示该权限，则该八进制数为：(644) ，该文件属性是(目录文件)。3、在Linux系统中，以(文件)方式访问设备。4、前台起动的…...
潍坊专业技术人员继续教育/百度笔记排名优化
蛙蛙还是给你带来了礼物。但它有个小小的要求，那就是你得在石头剪刀布上赢过它才能拿到礼物哦！ 现在根据你的观察，你已经知道了蛙蛙心想的出拳顺序，你需要安排自己的出拳顺序，使得你能在每一局中都获胜。 输入描述…...
网站每个月8g流量/网络营销的优势是什么
一：引言缓冲区溢出漏洞之所以这么多，是在于它的产生是如此的简单。只要C/C程序员稍微放松警惕，他的代码里面可能就出现了一个缓冲区溢出漏洞，甚至即使经过仔细检查的代码，也会存在缓冲区溢出漏洞。二：溢出 …...
开发板有哪些/宁波seo快速优化课程
Kafka使用的是Logging（日志文件）这种很原始的方式来存储消息 对于存储设计有一些知识点: Append Only、Linear Scans、磁盘顺序写、页缓存、零拷贝、稀疏索引、二分查找等等。 Append Only Data Structures 的一些存储系统比如HBase, Cassandra, Rocks…...