Javascript，獲取全局變量屬性

我想要做的是根據屏幕大小將全局變量點類型設置爲「mobile」或「desktop」。Javascript，獲取全局變量屬性

var userScreen = {}

if (screen is small){ 
    userScreen.type === 'mobile' 
} 
else { 
    userScreen.type === 'desktop' 
}

一切工作在同一個文件內，但我有得到userScreen.type問題在其他JavaScript文件可用。

屏幕size.js：

$(document).ready(function(){ 
    var userScreen = {}; 

    var resizeTimer; 
    $(window).on('resize load', function(e) { 
    clearTimeout(resizeTimer); 
    resizeTimer = setTimeout(function() { 
     var windowWidth = $(window).width(); 
     if ($('body').height() < $(document).height()) { 
     var windowWidth = windowWidth + 15; 
     } 
     if (windowWidth < 768){ 
     userScreen.type = 'mobile'; 
     } 
     else{ 
     userScreen.type = 'desktop'; 
     } 
    }, 250); 
    });

另一-JS文件

$(document).ready(function(userScreen){ 
    console.log(userScreen.type); 
});

控制檯登錄「userScreen.type」的結果：

function(obj) { 
    if (obj == null) { 
     return obj + ""; 
    } 
    // Support: Android<4.0, iOS<6 (functionish RegExp) 
    return typeof obj === "object" || typeof obj === "function" ? 
     class2type[ t…

負載訂購：

屏幕size.js
另一-JS-file.js

感謝

編輯

想說謝謝你大家的響應。最終的答案

所以我創建了一個IIFE只設置window.userScreen對象

GET-用戶screen.js

window.userScreen = {}; 

function getScreenSize(){ 
    var windowWidth = $(window).width(); 
    if ($('body').height() < $(document).height()) { 
    var windowWidth = windowWidth + 15; 
    } 
    if (windowWidth < 768){ 
    userScreen.type = 'mobile'; 
    } 
    else{ 
    userScreen.type = 'desktop'; 
    } 
    console.log(userScreen.type); 
} 

(function(){ 
    getScreenSize(); 
}());

這提供了全局變量來就像我想和消除超時問題引起了。一切都按預期工作。

再次感謝

來源

2016-02-27 Full-Hybrid

的userScreen不是一個全局變量。它存在於$（document）.ready作用域中。 –

聲明全局顯示的最佳方式是直接在window對象上創建它。因此，對於你的情況，創建它喜歡：

window.userScreen = {};

而且當你要訪問它，你可以再次通過window.userScreen做到這一點。許多人可能會反對這種用法，因爲全局變量有異味，但這是一種明顯與另一個開發人員溝通的方式，即您的全局是有意識的全局。

我主張使用更好的模式，如CommonJS模塊，但確實需要更多的設置和知識。但如果你很好奇，如果你想保持你的代碼清潔和劃分，這是一個很好的方向。

來源

2016-02-27 20:19:40 Cymen

試圖更好地進行分區，並且是非常有意的變量。感謝您的解釋和簡潔的回答。 –

你可以在你的HTML聲明變量，你加載任何的js文件之前，一個腳本標籤中。像這樣：

<script type='text/javascript' > 
    var userScreen = {}; 
</script>

把那個加載你的JavaScript文件的腳本標籤放在它們之前，它們都應該能夠使用那個變量。另外，請記住不要再重新聲明該變量;從內部刪除var userScreen = {}; screen-size.js

來源

2016-02-27 20:16:26 millerbr

感謝您的回覆，試圖避免在標記中設置任何內容 –

首先聲明它在document.ready之外（作爲全局變量）。其次，在設置它之前，您將獲得userScreen.type（請參閱timeout 250）。我會建議採用不同的方法，從你的描述中我沒有看到任何超時的問題。爲此：

屏幕size.js

function getSize(){ 
    if ($('body').height() < $(document).height()) { 
    var windowWidth = windowWidth + 15; 
    } 
    if (windowWidth < 768){ 
    return 'mobile'; 
    } 
    else{ 
    return 'desktop'; 
    } 
}

另一-JS-file.js：

$(document).ready(function(){ 
    console.log(getSize()); 
});

來源

2016-02-27 20:22:57

是的，我現在看到，必須設置某種類型的承諾，以便在該值可用時運行。 –

Javascript，獲取全局變量屬性

回答

相關問題