js变量生命周期
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" type="text/css" href="calc.css"> <script type="text/javascript" src="calc.js"></script> </head> <body onload="init()"> <div id="div1"> <div> <input type="text" name="" id="num"> </div> <div> <input type="button" name="" value="C"> <input type="button" name="" value="←"> <input type="button" name="" value="+/-"> <input type="button" name="" value="/"> <input type="button" name="" value="1"> <input type="button" name="" value="2"> <input type="button" name="" value="3"> <input type="button" name="" value="*"> <input type="button" name="" value="4"> <input type="button" name="" value="5"> <input type="button" name="" value="6"> <input type="button" name="" value="-"> <input type="button" name="" value="7"> <input type="button" name="" value="8"> <input type="button" name="" value="9"> <input type="button" name="" value="+"> <input type="button" name="" value="0"> <input type="button" name="" value="."> <input type="button" name="" value="="> <input type="button" name="" value="m"> </div> </div> </body> </html>
*{
margin: 0px;
padding: 0px;
}
div{
width:200px;
}
#div1{
position: absolute;
top: 100px;
left: 100px;
}
input[type="button"]{
width:40px;
margin-right:5px;
margin-bottom:5px;
}
input[type="text"]{
width:189px;
margin-bottom:5px;
text-align:right;
background-color:#ffffff;
border:1px solid;
box-sizing:border-box;
padding:0px 2px;
}function init(){
var num = document.getElementById("num");
num.value = 0;
num.disabled = "disabled";//禁用文本框
var num_value;
var oButton = document.getElementsByTagName("input");//给button添加事件
for(var i = 0; i < oButton.length-1; i++){
oButton[i].onclick = function(){
//var num_value = 1;
if(!isNaN(this.value)){
num.value = (num.value + this.value)*1;
}
else{
switch(this.value){
case"+":
num_value = Number(num.value);
num.value = 0;
fh = "+";
break;
case"-":
num_value = Number(num.value);
num.value = 0;
fh = "-";
break;
case"*":
num_value = Number(num.value);
num.value = 0;
fh = "*";
break;
case"/":
num_value = Number(num.value);
num.value = 0;
fh = "/";
break;
case".":
if(num.value.indexOf(".") == -1){//判断小数点是否存在
num.value += ".";
}
break;
case"C":
num.value = 0;
break;
case"←":
if(num.value.length>1){
num.value = num.value.substring(0, num.value.length-1);
}else{
num.value = 0;
}
break;
case"+/-":
num.value *= -1;
break;
case"=":
switch(fh){
case"+":
num.value = num_value + Number(num.value);
break;
case"-":
num.value = num_value - Number(num.value);
break;
case"*":
num.value = num_value * Number(num.value);
break;
case"/":
if(Number(num.value)==0){
alert("除数不能为0");
num.value = 0;
}else{
num.value = num_value / Number(num.value);
}
break;
}
break;
}
}
}
}
}代码是根据这节课的思路写出来的，请教老师几个问题：
1、init()中定义了局部变量num与num_value，在给元素添加事件的时候使用到了这两个变量，内层函数掉用外层函数的局部变量这个我理解。
在初始化完成后init()掉用结束，num与num_value都应该被销毁了，但是后面单击事件时调用的方法function()却可以直接使用num，num_value，fh 这是三个变量，而且我理解的"+"按钮点击事件结束之后方法也就结束了，变量应该被销毁了，为是什么再次使用"="按钮事件中可以使用到num_value与fh的值？？？
2、onload是否初始化后就直接结束了？
28
收起
正在回答
3回答
同学你好，1、因为JavaScript是弱类型语言，不声明也可直接使用，而且默认是全局变量。
所以fh也可以理解为全局变量，此时fh就是作为一个全局变量在使用呐。
2、每个元素绑定的事件实际上可以理解为每个oButton[i]元素都添加了一个单独的函数，并不是说它是同一个函数。
继续加油 祝：学习愉快~
相似问题
登录后可查看更多问答，登录/注册
java工程师2020版
- 参与学习 人
- 提交作业 9393 份
- 解答问题 16556 个
综合就业常年第一，编程排行常年霸榜，无需脱产即可学习，北上广深月薪过万 无论你是未就业的学生还是想转行的在职人员，不需要基础，只要你有梦想，想高薪
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星