在javascript中解释奇怪的行为
[英]Explaining odd behavior in javascript
问题描述
我在推特上看到了这个，我也无法解释。 以下面两种方式定义onload函数有效：
1） JSFiddle
<html>
<head>
<script>
onload = function(){
alert('this works');
};
</script>
</head>
<body>
</body>
</html>
2） JSFiddle
<html>
<head>
<script>
window.onload = function(){
alert('this works');
};
</script>
</head>
<body>
</body>
</html>
但是，如果定义如下，即使将其分配给window.onload ，它也不起作用
3） JSFiddle
<html>
<head>
<script>
function onload(){
alert('this doesnt work');
};
alert(window.onload); // this shows the definition of above function
</script>
</head>
<body>
</body>
</html>
这里发生了什么？
3 个解决方案
解决方案1
9 已采纳 2012-12-10 18:31:58
前两个示例为window.onload属性分配一个函数（ window.在第一个示例中是隐式的）。 onload属性实际上属于window的原型 （方便地称为Window ）。
第三个变体声明了一个具有相同名称的新本地函数，该函数会从原型中隐藏属性。 这意味着，当您要求window.onload ，引擎首先找到本地版本，并放弃查找原型链。 所以alert(window.onload); 确实提醒您的功能来源。 但是，要使事件处理程序起作用，必须将其分配给原型对象的onload属性。
但是，有一些奇怪的事情发生：当你尝试分配一个从prototype继承的属性时，它应该不起作用，并且应该在对象上创建一个“自己的”属性，从原型中隐藏一个属性（例如http://jsfiddle.net/ssBt9/ ）。 但window行为不同（ http://jsfiddle.net/asHP7/ ），行为甚至可能因浏览器而异。
解决方案2
3 2012-12-10 18:44:36
那是因为在脚本执行之前已经声明了onload并且为null 。
这类似于该代码：
var v=null;
function v(){
console.log('hi');
}
console.log(v); // alerts null
这不同于这个：
function v(){
console.log('hi');
}
console.log(v); // alerts the function
当声明这样的函数时，声明和赋值在逻辑上被提升到作用域的“开始”，因此在onload函数被赋予null值之后实际上不会发生赋值。
这就是它与众不同的原因
window.onload=...
这不是一项声明，只是一项不能悬挂的作业。
解决方案3
0 2012-12-10 18:33:29
在前两种情况下，您正在定义一个名为onload的窗口成员。 在第三种情况下，您只定义一个函数，但不是当前窗口的成员。
JavaScript日历的异常行为
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.