es6语法官网(【ES6丨前端进阶基础 】ES6的关键字,新特性以及解构赋值)
个人社区:山鱼社区
💬 如果文章对你有所帮助请点个👍吧! 欢迎关注 、点赞 、收藏(一键三连)和订阅专目录
前言
什么是ecmascrpit
一 ,let关键字的特点
1.不能重复声明变量
2.块级作用域
3.不存在变量提升
4.不影响作用域链
二 ,let的使用
三 ,const 声明常量以及特点
四 ,const的变量解构赋值
1.数组的结构
2.对象解构赋值
五 ,ES6新增字符串声明方式
1.反引号
2.新特性
3.变量拼接
六 ,对象的简化写法
七 ,箭头函数
写在最后
前言
ES全称EcmaScript ,是脚本语言的规范 ,而平时经常编写的JavaScript ,是EcmaScript的一种实现 ,所以ES新特性其实指的就是JavaScript的新特性
什么是ecmascrpit
ECMA (European Computer Manufacturers Association)中文名称为欧洲计算机制造商协会 ,这组织的目标是评估 、开发和认可电信和计算机标准 。1994年后该 组织改名为Ecma国际 。ecmascrpit是由Ecma国际通过ECMA-262标准化的脚本程序设计语言 。
一,let关键字的特点
1.不能重复声明变量
2.块级作用域
只能在块内使用 ,否则会报错
3.不存在变量提升
4.不影响作用域链
二 ,let的使用
三 ,const 声明常量以及特点
四 ,const的变量解构赋值
1.数组的结构
<script> //1. 数组的结构 const TW = [赵天王, 钱天王, 孙天王, 李天王]; let [zhao, qian, sun, li] = TW; console.log(zhao); console.log(qian); console.log(sun); console.log(li); </script>2.对象解构赋值
<script> const xiaopin = { name: 赵本山, age: 100, skill: function () { console.log(我是白云 ,我是黑土); } }; let { name, age, skill } = xiaopin; console.log(name); console.log(age); console.log(skill); skill(); </script>五 ,ES6新增字符串声明方式
1.反引号
2.新特性
3.变量拼接
使用${}来拼接
<script> // 3.变量拼接 使用${}来拼接 let hero = `山鱼`; let like = `${hero}爱吃猫`; console.log(like); </script>六 ,对象的简化写法
ES6 允许在大括号里面,直接写入变量和函数 ,作为对象的属性和方法
<body> <script> // ES6允许只放变量进到对象里 let name = 山鱼; let like = function () { console.log(我们一起学前端不放弃!); } const start = { name, like, skill() {// 可以省略冒号和function console.log(我会ES6); } } console.log(start); </script> </body>七 ,箭头函数
1.箭头函数this是静态的,this始终指向函数声明时所在作用域下的值
<script> // let fn = (a, b) => { // return a + b // } // 调用函数 // let result = fn(3, 3); // console.log(result); // 特性 // 1.this是静态的 ,this始终指向函数声明时所在作用域下的值 function gName1() { console.log(this.name); } let gName2 = () => { console.log(this.name); } window.name = 山鱼; const like = { name: SHANYU } // 直接调用 gName1(); //返回值为’山鱼‘ gName2(); //返回值为’山鱼‘ // 用call调用 ,call可以改变函数内部值 gName1.call(like);// 返回值为SHANYU gName2.call(like)//返回值为’山鱼‘ </script>2.不能作为构造函数作为实例化对象
<script> // 2.不能作为构造函数作为实例化对象 let Person = (name, age) => { this.name = name; this.age = age; } let it = new Person(旺财, 2); console.log(me); </script>3.不能使用arguments
<script> // 3.不能使用arguments变量(arguments可以用来保存实参) let fn = () => { console.log(arguments); } fn(1, 2, 3); </script>4.箭头函数的简写
<script> // 1 ,当形参有且只有一个的时候可以省略小括号 let jia = a => { return a + a; } console.log(jia(9)); // 2 ,当代码体只有一条语句的时候可以省略大括号 let pow = n => n * n; console.log(pow(3));// 语句的执行结果就是返回值 </script>写在最后
我是Aic山鱼 ,感谢您的支持
原 创 不 易 ✨还希望支持一下
点赞👍:您的赞赏是我前进的动力!
收藏⭐:您的支持我是创作的源泉!
评论✍:您的建议是我改进的良药!
山鱼🦈社区:山鱼社区💌💌创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!