JS变量的范围-内部函数
[英]Scope of JS variables - inside function
问题描述
http://jsfiddle.net/8Lc4N/1/ 
http://jsfiddle.net/8Lc4N/1/
Hi 你好
<h2 id="h2">click me </h2>
<p class="shirt"> </p>
var test = "reddish"; // Global scope ??
var hm;
console.log(test); //value is 'reddish' here
function red(test) // passing 'reddish'
{
var reddy= "blue"; // local scope - using this another var produces blue shirt
console.log(test); // i dont understand how it is 0 here
hm =test + "shirt";
return hm;
}
$(function(){
$('#h2').click(function(){
$('.shirt').html(red);
});
});
I am trying to print "Red shirt " inside 我正在尝试在里面打印“红色衬衫”
. 。
But the value of test becomes '0' inside function red(); 但是test的值在函数red（）中变为'0'；
Also when i declare a variable inside function red() (eg reddy.. ) it is correctly used as blue. 另外，当我在函数red（）中声明一个变量时（例如reddy ..），它被正确地用作蓝色。
So i would like to know what mistake i am doing and how can i pass test into the function as is. 所以我想知道我在做什么错误以及如何将测试直接传递给函数。
Thanks 谢谢
4 个解决方案
解决方案1
3 2014-05-03 10:58:52
You need to pass the test variable into your red function, so use: 您需要将test变量传递给red函数，因此请使用：
$('.shirt').html(red(test));
instead of: 代替：
$('.shirt').html(red);
解决方案2
2 2014-05-03 11:22:59
You are passing a function reference to the html method , so the function will be called for each element with two parameters; 您将函数引用传递给html方法 ，因此将为具有两个参数的每个元素调用该函数； the index of the element in the jQuery object and the current HTML code of the element. 元素在jQuery对象中的索引以及该元素的当前HTML代码。
It's the same as looping through the elements in the jQuery object and calling the function for each of them to get the HTML code to put in the element: 这与循环遍历jQuery对象中的元素并为每个元素调用函数以获取要放入元素的HTML代码相同：
var j = $('.shirt');
for (var i = 0; i < j.length; i++) {
j.eq(i).html(red(i, j.eq(i).html()));
}
As the function takes one parameter, it will be the index of the element in the jQuery object, in this case zero as there is just one element. 由于该函数采用一个参数，它将是jQuery对象中元素的索引，在本例中为零，因为只有一个元素。
The parameter test in the function is not the same as the variable test in the global scope. 函数中的参数test与全局范围中的变量test 。 As you have named them the same the parameter will shadow the global variable for the code inside the function. 正如您为它们命名的一样，该参数将在函数内部的代码的全局变量中隐藏阴影。
To make the parameter test get the value from the global variable test you need to call the function with that value: 为了使参数test得到的全局变量值test ，你需要调用与价值的功能：
$('.shirt').html(red(test));
解决方案3
1 2014-05-03 11:03:43
Your code with a little explaination 您的代码有一点解释
var test = "reddish"; // Global scope - the var is saved on the window.
console.log(test); // same as console.log(window.test)
function red(test) // you declared a function with an input param named test. this is not the same test.
console.log(test); // test is nothing in this case since you called the red function with no param.
Change the call to : 将呼叫更改为 ：
$('.shirt').html(red(test)); // call function red with the correct input param.
解决方案4
1 2014-05-03 11:07:43
Your are not passing any parameter value to function "red".So, it is taking test value as "0" If you pass any value, then it will prints that value instead of "0". 您没有将任何参数值传递给函数“ red”。因此，它将测试值作为“ 0”。如果传递任何值，则它将打印该值而不是“ 0”。
Code: 码：
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<h2 id="h2">click me </h2>
<p class="shirt"> </p>
<script type="text/javascript">
var test = "reddish"; // Global scope ??
var hm;
console.log(test);
function red(test) {
var reddy = "blue"; // local scope - using this var produces blue shirt
console.log(test);
hm = test + "shirt";
return hm;
}
$(function() {
$('#h2').click(function() {
$('.shirt').html(red(test));
});
});
</script>
</body>
</html>
JS Fiddle: http://jsfiddle.net/NZBNW/2/ JS小提琴： http : //jsfiddle.net/NZBNW/2/
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.