当前位置: 首页 > news >正文

ES6笔记总结

首先我们需要了解一下什么是 ECMA:
ECMA(European Computer Manufacturers Association)中文名称为欧洲计算机制造商协会,这

个组织的目标是评估、开发和认可电信和计算机标准。1994 年后该组织改名为 Ecma 国际

什么是 ECMAScript :
ECMAScript 是由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言;

百度百科:https://baike.baidu.com/history/ECMAScript/1889420/144946978

ECMA-262 历史 :
ES6 从开始制定到最后发布,整整用了 15 年。

前面提到,ECMAScript 1.0 是 1997 年发布的,接下来的两年,连续发布了 ECMAScript 2.0

(1998 年 6 月)和 ECMAScript 3.0(1999 年 12 月)。3.0 版是一个巨大的成功,在业界得到

广泛支持,成为通行标准,奠定了 JavaScript 语言的基本语法,以后的版本完全继承。直到今

天,初学者一开始学习 JavaScript,其实就是在学 3.0 版的语法。

ECMA-262其实就是javascript
个人还是比较推荐使用ES6的,ES6 的版本变动内容最多,具有里程碑意义,其中也是加入许多新的语法特性,编程实现更简单、高效;

 那下面我们就来看下ES6有哪些新特性吧:

1.let 关键字

 let 关键字用来声明变量,使用 let 声明的变量有几个特点:

1. 不允许重复声明;

2. 块儿级作用域(局部变量);

3. 不存在变量提升;

4. 不影响作用域链; 

2.const 关键字 

const 关键字用来声明常量,const 声明有以下特点: 

1. 声明必须赋初始值;

2. 标识符一般为大写(习惯);

3. 不允许重复声明;

4. 值不允许修改;

5. 块儿级作用域(局部变量); 

3.变量和对象的解构赋值

 什么是解构赋值:

ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构赋值;

应用场景:

频繁使用对象方法、数组元素,就可以使用解构赋值形式;

 代码实现:

// ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构
赋值;
// 1、数组的解构赋值
const F4 = ["大哥", "二哥", "三哥", "四哥"];
let [a, b, c, d] = F4;
// 这就相当于我们声明 4 个变量 a,b,c,d,其值分别对应"大哥","二哥","三哥","四哥 " 
console.log(a + b + c + d); // 大哥二哥三哥四哥
// 2、对象的解构赋值
const F3 = {name: "大哥",age: 22,sex: "男",xiaopin: function() { // 常用console.log("我会演小品!");}
}
let {name,age,sex,xiaopin
} = F3; // 注意解构对象这里用的是{} 
console.log(name + age + sex + xiaopin); // 大哥 22 男
xiaopin(); // 此方法可以正常调用

4.模板字符串

 模板字符串(template string)是增强版的字符串,用反引号(`)标识

字符串中可以出现换行符;可以使用 ${xxx} 形式引用变量;

5.简化对象和函数写法

 ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁;

代码示例:

// ES6 允许在对象的大括号内直接写入变量和函数作为对象的属性和方法
// 变量和函数
let name = "訾博";
let change = function() {console.log("活着就是为了改变世界!");
}
//创建对象
const school = {// 完整写法// name:name,// change:change// 简化写法name,change,// 声明方法的简化say() {console.log("言行一致!");}
}
school.change();
school.say();

6.箭头函数

ES6 允许使用箭头(=>)定义函数,箭头函数提供了一种更加简洁的函数书写方式,箭头函数多用于匿名函数的定义;

箭头函数的注意点:

 1. 如果形参只有一个,则小括号可以省略;

2. 函数体如果只有一条语句,则花括号可以省略,函数的返回值为该条语句的执行结果;

3. 箭头函数 this 指向声明时所在作用域下 this 的值;

4. 箭头函数不能作为构造函数实例化;

5. 不能使用 arguments;

箭头函数的特点:

1. 箭头函数的 this 是静态的,始终指向函数声明时所在作用域下的 this 的值;

2. 不能作为构造实例化对象;

3. 不能使用 arguments 变量; 

7. ES6 中函数参数的默认值

ES 允许给函数的参数赋初始值;

代码示例:

//1. 形参初始值 具有默认值的参数, 一般位置要靠后(潜规则)
function add(a, b, c = 10) {return a + b + c;
}
let result = add(1, 2);
console.log(result); // 13
//2. 与解构赋值结合
// 注意这里参数是一个对象
function connect({host = "127.0.0.1",username,password,port
}) {console.log(host)console.log(username)console.log(password)console.log(port)
}
connect({host: 'baidu.com',username: 'root',password: 'root',port: 3306
})

8.rest 参数

ES6 引入 rest 参数,用于获取函数的实参,用来代替 arguments ; 

9.扩展运算符

 ... 扩展运算符能将数组转换为逗号分隔的参数序列;
扩展运算符( spread )也是三个点( ... )。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的 参数序列,对数组进行解包;

 10.Symbol

表示独一无二的值;

 11.Promise

非常强大的异步编程的新解决方案;

 12.Set 集合

类似数组,但元素不重复的集合;

13.Map 集合键值对集合; 

 14.class 类

像 java 实体类一样声明 js 类;

 15.数值扩展

增加一些数值相关的方法等;

16.对象扩展

增加一些对象相关的方法等;

17.模块化

 模块化、组件化;

18.Babel 对 ES6 模块化代码转换

为了适配浏览器,将更新的 ES 规范转换成 ES5 规范;

 19.ES6 模块化引入 NPM 包

像导入模块一样导入 npm 包;

http://www.lryc.cn/news/544482.html

相关文章:

  • 使用Docker Desktop部署GitLab
  • 经典算法 统计数字问题(常数时间解决)
  • 基于yolov8的糖尿病视网膜病变严重程度检测系统python源码+pytorch模型+评估指标曲线+精美GUI界面
  • AcWing 5933:爬楼梯 ← 递归 / 递推 / 高精度
  • c++ 中的容器 vector 与数组 array
  • 我的世界1.20.1forge模组开发进阶物品(7)——具有动画、3D立体效果的物品
  • ubuntu22.04安装docker engine
  • 性能测试测试策略制定|知名软件测评机构经验分享
  • Let‘s Encrypt免费证书的应用示例
  • threeJS——安装以及三要素
  • 【Electron入门】进程环境和隔离
  • 提示词框架介绍和使用场景
  • 牛客NC288803 和+和
  • AI学习第七天
  • 【uniapp原生】实时记录接口请求延迟,并生成写入文件到安卓设备
  • XR应用测试:探索虚拟与现实的边界
  • 算法之算法思想
  • mac电脑中使用无线诊断.app查看连接的Wi-Fi带宽
  • 物理竞赛中的线性代数
  • FFmpeg-chapter3-读取视频流(原理篇)
  • 机器视觉线阵相机分时频闪选型/机器视觉线阵相机分时频闪选型
  • 「Selenium+Python自动化从0到1②|2025浏览器操控7大核心API实战(附高效避坑模板))」
  • 矩阵系列 题解
  • 活动报名:Voice Agent 技术现状及应用展望丨 3.8 北京
  • 【卡牌——二分】
  • 《第十五部分》STM32之FLASH闪存(终结篇)
  • 属性的设置
  • 本地部署Deepseek+Cherry Studio
  • CMU15445(2023fall) Project #2 - Extendible Hash Index 匠心分析
  • 【VSCode】VSCode下载安装与配置极简描述