概述
1、变量 let 和 常量 const
(1)原来定义变量 var 存在的的问题
① 可以重复声明,没有报错和警告
② 无法限制修改
③没有块级作用域, { }
(2)let 和 const
① 不能重复声明
② 都是块级作用域, { } 块内声明的,块外无效
③ let 是变量,可以修改
④ const 是常量,不能修改
⑤ 块级作用域举例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script>
window.onload= function () {
/*
var aBtn = document.getElementsByTagName('input')
for (var i=0; i < aBtn.length; i++) {
aBtn[i].onclick = function () {
alert(i)
}
}*/
//弹出结果是 2 2 2
/* 解决方式为 闭包
var aBtn = document.getElementsByTagName('input')
for (var i = 0; i < aBtn.length; i++) {
// 封装到函数里,限制作用域
(function (i) {
aBtn[i].onclick = function () {
alert(i)
}
})(i)
}*/
//用let定义变量直接解决上面的问题
var aBtn = document.getElementsByTagName('input')
for (let i = 0; i < aBtn.length; i++) {
aBtn[i].onclick = function () {
alert(i)
}
}
// 弹出结果为 0 1 2
}
</script>
</head>
<body>
<input type="button" value="按钮1">
<input type="button" value="按钮2">
<input type="button" value="按钮3">
</body>
</html>
原来用 var 的方式,结果弹出的都是 3
或者将变量 封装到函数里,限制作用域,但比较麻烦
用 let 最简单,直接 var 改 let,解决作用域问题
2、ECMAScript 和 JavaScript
(1 )ECMA 是标准,JS 是实现
ECMAScript 简称 ECMA 或 ES
历史版本
①1996, ES1.0 Netscape 将 JS 提交给 ECMA 组织,ES 正式出现
②1999, ES3.0 被广泛支持
③2011, ES5.1 成为 ISO 国际标准
④2015, ES6.0 正式发布
(2) ES6兼容性
ES6(ES2015) 支持的环境 IE10+, Chrome, FireFox, 移动端, NodeJS
(3) 解决不兼容办法,编译、转换
在线转换
或者提前编译
Babel 中文网
Babel 入门教程 阮一峰
Babel 是一个 JavaScript 编译器
一个广泛使用的转码器,可以将ES6代码转为ES5代码,从而在现有环境执行
现在就用 ES6 编写程序,而不用担心现有环境是否支持。
3、ES7 预览(ES2017)的新增内容(简单了解)
(1)数组
arr.includes() 数组是否包含某个东西
数组的 arr.keys(), arr,entries()
for … in 遍历数组 下标 key
for … of 遍历数组 值 value, 不能用于json
let arr = ['a', 'b', 'c']
console.log(arr.includes(1))
for (let i in arr) {
console.log(i) // 循环的时下标 key
}
for (let i of arr) {
console.log(i) // 循环的是值 value
}
for (let i of arr.keys()) {
console.log('>'+i)
}
for (let [key, value] of arr.entries()) {
console.log('>' + key + value)
}
let json = { a: 12, b: 5, c: 7 }
for (let i in json) {
console.log(i)
}
(2)字符串
padStart()/padEnd() 指定宽度,不够就补空格或指定字符
console.log(’=’ + ‘abcd’.padStart(6, ‘0’) + ‘=’)
console.log(’=’ + ‘abcd’.padEnd(6, ‘0’) + ‘=’)
=00abcd=
=abcd00=
容忍度
[1, 2, 3,] 老版数组最后不能有逗号,新的可以有
函数参数最后多的逗号也可以
**(3)async await
和 generator yield 类似,是它的语法糖
generator 不可以写成箭头函数, async 可以
async function show() {
console.log(1)
await
console.log(2)
}
最后
以上就是干净大象为你收集整理的ES6中定义变量以及简介的全部内容,希望文章能够帮你解决ES6中定义变量以及简介所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复