无事来学学--ES6语法部分了解和ES5区别

简介: ES6( ECMAScript 6.0) ,概念ES6 主要是为了解决 ES5 的先天不足,比如 JavaScript 里并没有类的概念,但是目前浏览器的 JavaScript 是 ES5 版本,大多数高版本的浏览器也支持 ES6,不过只实现了 ES6 的部分特性和功能。

ES5和ES6的主要区别


箭头函数和字符串嵌入:

constgreetings=(name)=>{returnhello ${name};}

甚至:

constgreetings=name=>hello ${name};


常量声明(Const):

如同其它编程语言中的常量一样,但又有不同。这里的const代表了constant reference。也就是说,你可以修改其指向的对象的值。但是你不能修改其reference的值。

constNAMES=[];NAMES.push("Jim");console.log(NAMES.length===1);// trueNAMES=["Steve","John"];// error


块作用域变量:

ES6中的新关键字let允许允许开发者将变量的作用域限定在块级别。不会像var一样变量提升。


参数默认值

允许在函数定义的时候指定默认的值。

// Basic syntaxfunctionmultiply(a,b=2){returna*b;}multiply(5);// 10


类定义和继承

  • ES6开始支持定义类(使用class关键字),构造函数(使用constructor关键字),和extend关键字来实现继承。
  • for-of操作
  • for...of语句用来迭代访问一个对象的所有属性。
  • Spread操作符:用于对象合并

constobj1={a:1,b:2}constobj2={a:2,c:3,d:4}constobj3={...obj1,...obj2}

  • Promise: Promises提供了一个处理异步操作的方法。你可以用回调函数来实现,但是Promise更加简洁和可读。
constisGreater=(a,b)=>{returnnewPromise((resolve,reject)=>{if(a>b){resolve(true)}else{reject(false)}})}isGreater(1,2).then(result=>{console.log('greater')}).catch(result=>{console.log('smaller')})
复制代码


模块的export和import。

constmyModule={x:1,y:()=>{console.log('This is ES5')}}exportdefaultmyModule;
importmyModulefrom'./myModule';
复制代码


Let和Const
ES6 新增加了两个重要的 JavaScript 关键字: let 和 const。
复制代码


let 声明的变量只在 let 命令所在的代码块内有效。而js中var可以多次声明 const 声明一个只读的常量,一旦声明,常量的值就不能改变。

常用的对象解构

//对象解构 let user ={name:'12312',age:12}

//传统js let name1=user.name let age1=user.age console.log(name1,age1)

//ES6语法 let {name,age}=user console.log(name,age)

3.模板字符串相当于加强版的字符串,用反引号 `,除了作为普通字符串,还可以用来定义多行字符串,还可以在字符串中加入变量和表达式。

let name = "Mike";
let age = 27;
let info = `My Name is ${name},I am ${age+1} years old next year.`
console.log(info);
复制代码


4.ES6对象ES6允许对象的属性直接写变量,这时候属性名是变量名,属性值是变量值。

const age = 12;
const name = "Amy";
//ES6
const person = {age, name};
person   //{age: 12, name: "Amy"}
//等同于
const person = {age: age, name: name}
复制代码


5.对象的拓展运算符

拓展运算符(…)用于取出参数对象所有可遍历属性然后拷贝到当前对象。

对象的复制

let person = {name: "Amy", age: 15};
let someone = { ...person };
//someone{name: "Amy", age: 15}
复制代码


对象的合并

let age = {age: 15};
let name = {name: "Amy"};
let person = {...age, ...name};
//person;  {age: 15, name: "Amy"}
复制代码


6.箭头函数

*箭头函数提供了一种更加简洁的函数书写方式。多用于匿名函数的定义,基本语法是:参数 => 函数体

//传统方式定义函数
var f1 =function(a){
  return a
}
console.log(f1(3))
//es6使用箭头函数定义
var f1=a =>a
console.log(f1(3))
复制代码

当箭头函数没有参数或者有多个参数,要用 () 括起来。 var f = (a,b) => a+b; f(6,2); //8

当箭头函数函数体有多行语句,用 {} 包裹起来,表示代码块,当只有一行语句,并且需要返回结果时,可以省略 {} , 结果会自动返回

var f = (a,b) => {
 let result = a+b;
 return result;
}
f(6,2);  // 8



目录
相关文章
|
缓存 NoSQL 应用服务中间件
Redis-多级缓存
什么是多级缓存 传统的缓存策略一般是请求到达Tomcat后,先查询Redis,如果未命中则查询数据库,如图: 存在下面的问题: 请求要经过Tomcat处理,Tomcat的性能成为整个系统的瓶颈 Redis缓存失效时,会对数据库产生冲击 多级缓存就是充分利用请求处理的每个环节,分别添加缓存,减轻Tomcat压力,提升服务性能: 浏览器访问静态资源时,优先读取浏览器本地缓存 访问非静态资源(ajax查询数据)时,访问服务端 请求到达Nginx后,优先读取Nginx本地缓存 如果Nginx本地缓存未命中,则去直接查询Redis(不经过Tomcat) 如果Redis查询未命中,则查询To
349 0
|
11月前
|
消息中间件 关系型数据库 Kafka
一种小资源情况下RDS数据实时同步StarRocks方案
使用一台4C8 G服务器轻松实现2个MySQL实例中通过负责分库分表规则之后的5000多张表的数据实时同步到StarRocks
446 67
|
Java API 开发者
JDK8到JDK17版本升级的新特性问题之SpringBoot选择JDK17作为最小支持的Java lts版本意味着什么
JDK8到JDK17版本升级的新特性问题之SpringBoot选择JDK17作为最小支持的Java lts版本意味着什么
375 0
JDK8到JDK17版本升级的新特性问题之SpringBoot选择JDK17作为最小支持的Java lts版本意味着什么
C 作用域详解
在 C 语言中,作用域决定了变量和函数的可见性和生命周期,包括块作用域、函数作用域、文件作用域和全局作用域。块作用域内的变量仅在块内有效,函数作用域内的变量在整个函数内有效,文件作用域内的全局变量和函数在整个文件内有效,而全局作用域内的变量和函数在整个程序运行期间有效。作用域的优先级遵循局部变量优先的原则,局部变量会遮蔽同名的全局变量。变量的生命周期分为局部变量(函数调用时创建和销毁)、全局变量(程序开始时创建和结束时销毁)以及静态变量(整个程序期间有效)。理解作用域有助于避免命名冲突和错误,提高代码的可读性和可维护性。
|
消息中间件 Prometheus Kubernetes
K8S的Kafka监控(Prometheus+Grafana)
本文实战操作如何在K8S环境对kafka做监控(Prometheus+Grafana)
828 0
K8S的Kafka监控(Prometheus+Grafana)
|
人工智能 程序员 开发者
AI 时代程序员还“香”吗?别错过这场 OG & 跨界技术人的坦白局!
大模型当道的今天,程序员的职业选择与未来发展正在经历哪些变化和机会?大厂在招聘技术岗时会重点关注哪些能力?AI 时代下程序员的职场发展需要哪些“新活儿”傍身?7 月 11 日晚 19:00,我们请来了你熟悉的“OG 程序员”和“跨界程序员”,一起来一场“坦白局”!
|
自然语言处理 开发者
《黑神话:悟空》的剧情脚本与对话系统设计
【8月更文第26天】在《黑神话:悟空》这款游戏中,引人入胜的故事情节和丰富多样的对话系统是吸引玩家的关键因素之一。本文将详细介绍游戏剧情脚本的编写过程以及交互式对话系统的实现技术。
576 0
|
SQL 缓存 数据库
PL/SQL的性能优化
PL/SQL的性能优化
222 0