有条件地加载javascript资源 [英] conditionally load javascript resource
问题描述
我正在创建一个网站，其中的某些页面至少包含一个媒体播放器，并且由于页面大小的限制，我只想在具有媒体的页面中加载媒体播放器的javascript文件.我将媒体信息存储在页面顶部的javascript对象中，并将其他脚本文件加载到正文的末尾.
I'm creating a website which some of it's pages contain at least one media player and because of the page size limitations, I want to load the media player javascript file only in pages that have medias. I store media information in an javascript object in head of the page and other script files are being loaded at the end of body.
我发现此解决方案(使用 $.getScript )非常好，但是我想要一个不依赖任何框架的解决方案.我在 jQuery 网站上看到了一个有趣的实现，并且我做了如下更改:
I found this solution (using $.getScript) very nice but I want a solution that doesn't rely on any frameworks. I saw an interesting implementation in jQuery website and I changed it like this:
<script>typeof(player) != 'object' || document.write(unescape('%3Cscript src="/assets/js/player/mediaplayer/jwplayer.js"%3E%3C/script%3E'));</script>
，它的工作原理很吸引人，但是由于我不是JavaScript专业人士，所以我想知道这是如何工作的?
and it works like a charm but as I'm not pro in javascript I want to know how does this work?
- 如果我们没有对象类型的变量，是否不需要检查第二个条件?
- 其他浏览器如何对此代码进行操作?
- 是否所有人(甚至是较旧的IE)都跳过了第二个条件，或者他们可能会检查所有条件?
- 跨浏览器行为是否有更好的解决方案?
推荐答案
您指的是短路.
您看到的代码使用 || ，即或"运算符.因此，对于或"运算符，只需要其中一个操作数为真.这意味着一旦其中一个操作数满足条件，其余的就不会被评估.例如:
The code you see uses ||, which is the "or" operator. So for an "or" operator, only one of the operands needs to be true. That means that as soon as one of the operands fulfills the condition, the rest aren't evaluated. For example:
if (returnTrue() || returnFalse()) {
(其中的函数说明了一切) returnFalse()方法甚至由于短路而不会被调用. returnTrue()条件满足或"运算符，因为一个操作数(第一个)的计算结果为true.
(where the functions speak for themselves) the returnFalse() method won't even be called because of short circuiting. The returnTrue() condition fulfills the "or" operator, because one of the operands (the first) evaluates to true.
"and"运算符则相反，所有操作数必须取值为 true 才能实现.
An "and" operator is the opposite, where all of the operands must evaluate to true in order for it to be fulfilled.
例如:
if (returnTrue() && returnFalse()) {
将调用 returnFalse() ，因为 if 语句需要知道所有操作数是否都评估为 true .由于第一个是为true，因此它将继续评估操作数.另一个例子:
The returnFalse() will be called because the if statement needs to know if all operands evaluate to true. Since the first one is true, it continues evaluating the operands. Another example:
if (returnTrue() && returnFalse() && returnTrue()) {
仅会执行前两个调用，但 returnFalse()会破坏比较，并且会短路，直到到达最后一个 returnTrue()
Only the first two calls will execute, but returnFalse() ruins the comparison, and it short circuits before it can get to the last returnTrue()
所有这些规则"都适用于 if 语句之外，这就是您的代码起作用的原因.因此，对于您的代码，它的意思是如果 player 是一个对象，请继续评估操作数".您的代码基本上与以下代码相同:
All of these "rules" apply to outside of an if statement, which is why your code works. So with your code, it's saying "if player is an object, continue evaluating operands." Your code is basically the same as:
if (typeof(player) == 'object') {
document.write("stuff");
}
我确定你知道.
参考:
这篇关于有条件地加载javascript资源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
