编写函数的不同方式会在JavaScript中带来不希望有的效果
Different ways of writing a function bringing undesired effects in JavaScript?
更新:
问题解决了我意识到这是因为"吊装"基本上,JavaScript解释器解析代码,并在函数开始时声明所有变量(但不初始化它们)。这就是为什么第二个例子不起作用。因为JavaScript解释器在函数的开头声明var changed;
,但在到达代码体之前不会初始化它。
对于像第一个例子一样的函数声明,JavaScript不像第二个例子那样只向上移动变量名,而是在父函数的开头向上移动(或"提升")整个函数,这就是它工作的原因!
不管怎样,我写这篇文章是为了个人参考,谢谢你的回答。。。
这个有效:http://jsbin.com/emarat/7/edit
$(function(){
$name = $('#test');
$name.change(changedName);
function changedName (e){
console.log('e: ', e);
console.log('e.currentTarget: ', e.currentTarget);
console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
$('#test-display').text($(e.currentTarget).val());
}
});
但这个没有:http://jsbin.com/emarat/9/edit
$(function(){
$name = $('#test');
$name.change(changed);
var changed = function(e){
console.log('e: ', e);
console.log('e.currentTarget: ', e.currentTarget);
console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
$('#test-display').text($(e.currentTarget).val());
};
});
为什么
后一个等价于:
$(function(){
var changed;
$name = $('#test');
$name.change(changed);
changed = function(e){
//...
};
});
这就说明了为什么它不起作用。在使用时,changed
变量尚未初始化(undefined
)。
但是,如果使用function yourFunctionName()
语法声明一个函数,那么它在整个作用域中都可用。(在JavaScript中,它是父函数。)否则,就不可能在函数声明之前使用它们。它被称为吊装。
另请参阅:
- var functionName=function(){}vs function functionName()
- 惊讶于全局变量在JavaScript中有未定义的值
因为变量是在使用后定义的
var a = 1;
var c = a + b;
var b = 2;
您不会期望该代码运行。
第一个定义了作用域中的函数。第二个创建了一个内联函数,并将对它的引用存储在局部变量changed
中。问题是,你在使用变量后填充它。
这将起作用:
$(function(){
var changed = function(e){
console.log('e: ', e);
console.log('e.currentTarget: ', e.currentTarget);
console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
$('#test-display').text($(e.currentTarget).val());
};
$name = $('#test');
$name.change(changed);
});
http://jsbin.com/emarat/11/edit
相关文章:
- 是否有一个JS/jQuery函数可以获取某个类的每个元素的ID
- 在输入字段上有两个函数调用,一个在Blur上,一个不在Angular中
- 如果在构造函数中有“返回”,则在 JavaScript 中的新运算符中做了什么
- 为什么jQuery文件的函数中有两个参数,但只接收一个参数
- 是否有任何Javascript函数从指定的索引中进行正则表达式匹配
- 在javascript中使用split函数希望在页面加载时拆分url
- 缓存!saveLocations()和addLocation()函数有什么区别
- 我有多个复选框,并希望为其中 2 个制定规则,以便如果我选择 1 个,则无法选择另一个
- 鉴于 for..在构造中,库提供的函数(如 jQuery.map() 或 _.each())有什么用
- 有没有什么方法可以停止Jquery中的animate(也可以停止完整的回调函数)
- 有条件地运行javascript函数-Razor,HTML
- 函数调用方法有什么用
- 当我们在数组中有函数的参数时,如何调用函数
- 是否有函数可以测试对象是否与其他对象匹配
- BMI 计算器希望有一个 parseInt() 函数
- 有函数返回请求数据+要执行的函数
- 希望JS函数使用ajax运行PHP,然后在页面上输出PHP
- 内部有函数的Angular指令映射对象
- 检查一个对象是否是一个有希望的函数
- 当Yii添加类错误时,是否有函数回调可用