本文摘自PHP中文网,作者藏色散人,侵删。
var和let都用于javascript中的函数声明,它们之间的区别是,var是函数作用域,let是块作用域。可以说,与let相比,用var声明的变量在整个程序中都是定义的。
举个例子会更清楚地说明这种区别,如下:
var的例子:
1 2 3 4 5 6 7 | 输入:
console.log(x);
var x=5;
console.log(x);
输出:
undefined
5
|
let的例子:
1 2 3 4 5 6 | 输入:
console.log(x);
let x=5;
console.log(x);
输出:
Error
|
让我们看看JavaScript代码:
代码示例1:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <html>
<body>
<script>
var x = 5;
document.write(x, "\n" );
let y = 10;
document.write(y, "\n" );
document.write(z, "\n" );
var z = 2;
document.write(a);
let a = 3;
</script>
</body>
</html>
|
输出:
代码示例2:
在下面的代码中,单击start将调用一个函数,该函数每0.5秒更改两个标题的颜色。第一个标题的颜色存储在一个var中,第二个标题使用let声明。
然后在函数块之外访问它们。Var将工作,但使用let声明的变量将显示一个错误,因为let是块作用域。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | <!DOCTYPE html>
<html>
<head>
<title>js教程</title>
<meta charset= "UTF-8" >
</head>
<body>
<h1 id= "var" style= "color:black;" >javascript教程</h1>
<h1 id= "let" style= "color:black;" >javascript教程</h1>
<button id= "btn" onclick= "colour()" >Start</button>
<script type= "text/javascript" >
function colour() {
setInterval( function () {
if (document.getElementById( 'var' ).style.color == 'black' )
var col1 = 'blue' ;
else
col1 = 'black' ;
if (document.getElementById( 'let' ).style.color == 'black' ) {
let col2 = 'red' ;
} else {
col2 = 'black' ;
}
document.getElementById( 'var' ).style.color = col1;
document.getElementById( 'let' ).style.color = col2;
}, 500);
}
</script>
</body>
</html>
|
输出:
相关推荐:《javascript教程》
本篇文章就是关于JavaScript中的var和let之间的区别介绍,希望对需要的朋友有所帮助!
以上就是JavaScript中的var和let的区别(代码示例)的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
iview组件事件额外传递参数的代码示例
javascript怎么将数字转换成时间
javascript如何改变文本内容
js怎么修改css类
javascript怎么去掉标签
深入了解javascript中的object(对象)
javascript中宿主对象和原生对象的区别是什么
javascript中dom常用的方法有哪些
javascript中如何声明变量
javascript怎么删除input
更多相关阅读请进入《javascript》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » JavaScript中的var和let的区别(代码示例)