2016-11-04 97 views
0

我有以下代碼來爲div動畫。它完美:僅在匿名函數中出現UncaughtType錯誤

function fadeAndSlideIn(el,m,t) { 
    el.style.opacity = 0; 
    el.style.marginTop = 0; 

    var oi = 1/(t * 60); 
    var mi = m/(t * 60); 

    var tick = function() { 
     el.style.opacity = +el.style.opacity + oi; 
     el.style.marginTop = (parseInt(el.style.marginTop) + mi) + 'px'; 

     if (+el.style.opacity < 1) 
      (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16); 
    } 

    tick(); 
} 

(function() { 
    fadeAndSlideIn(document.getElementById('pan1'),125,1); 
    setTimeout(function() { 
     fadeAndSlideIn(document.getElementById('pan2'),125,1); 
    },500); 
    setTimeout(function() { 
     fadeAndSlideIn(document.getElementById('pan3'),125,1); 
    },1000); 
})(); 

然而,當我改變fadeAndSlideIn功能匿名函數是這樣的:

var fadeAndSlideIn = function(el,m,t) { 

我的程序不能正常工作,我得到以下錯誤

Uncaught TypeError: Cannot set property 'opacity' of undefined

爲什麼功能減弱會改變性能?所有代碼位於正文末尾的<script>標記中。

+0

你可以調試'el'和輸出是什麼? – jdmdevdotnet

+0

沒有值從'fadeAndSlideIn'返回 – guest271314

+0

我懷疑這是你做的唯一的改變。 –

回答

2

JS已經自動分號插入。這不是很聰明,因爲有時候引擎不能這樣做,你會產生錯誤。因此請務必使用分號:

var a=function(){} //bad 
var a=function(){}; //good 

在你的代碼,因爲飾演Felix克林說,它認爲它的IIFE發動機出現故障:

var a=function(){} 
(some other code); 

因此,實際上它通過你的IIFE到fadeInSlide爲E1和你的函數的el.style是未定義的...

+0

哎呦,我錯過了!謝謝 –

+1

*「有時引擎不能這麼做」*它不會「失敗」。 ASI根本不適用。有明確的規則,如果你不知道規則,不要依賴ASI :) –