ES6的var和let的区别
程序员文章站
2022-06-11 22:13:45
...
<!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>
</head>
<body>
<!--
var的缺点：
1，可以重复声明
2，无法限制它的修改（没有常量的语言）
3，没有块级作用域
ES6新的定义变量方式
let的优点‘
1，不能重复声明
2，可以修改
3，有块级作用域
const：
1，不能重复声明
2，不能修改
3，有块级作用域
ES6的箭头函数
()+>{
}
es：
let show=function(){
}
let show=()=>{
}
1,如果只有一个参数，（）可以省
es：
let show=(a)=> 可以写成 let show=a=>
2，如果只有一个return，{}可以省
函数的参数
1，参数的扩展/展开
2，默认参数
参数扩展
1，收集剩余的参数
function show(a,b,...args){}
*Rest Parameter必须是最后一个
2，展开数组
展开后的效果，跟直接把数组的内容写在里面一样
默认参数
-->
<input type="button" value="按钮1">
<input type="button" value="按钮1">
<input type="button" value="按钮1">
</body>
<script>
window.onload=function()
{
var btn=document.getElementsByTagName("input");
// 块级作用域问题
// 1，错误写法
// for(var i=0;i<btn.length;i++)
// {
// btn.onclick=function(){
// alert(i);
// }
// }
// 2,正确写法
// for(var i=0;i<btn.length;i++){
// (function(i){
// btn[i].onclick=function(){
// alert(i);
// };
// })(i);
// };
for(let i=0;i<btn.length;i++)
{
btn[i].onclick=function(){
alert(i);
}
}
}
</script>
</html>
上一篇： ES6 let和var区别