[解決済み] JSLint "この関数は「use strict」プラグマが必要です。"

質問

このコードをJSLintingすると、「This function needs a "use strict" pragma.".」というエラーが発生するのですが、どなたか原因をご存知でしょうか？私はすべての関数に "use strict" を追加することによってこれを修正することができましたが、私はむしろそれを完全に修正する方法を知っています。乾杯

/*jslint browser: true, devel: true,  white: true, long: true, for: true*/
/*eslint-env browser*/
/*eslint 'no-console':0*/

var metronomebutton = document.querySelector("#playMetronome");
var stopmetronomebutton = document.querySelector("#stopMetronome");
var playing;
var audiobutton1 = document.querySelector("#c1Button");
var audiobutton2 = document.querySelector("#d1Button");
var audiobutton3 = document.querySelector("#e1Button");
var audiobutton4 = document.querySelector("#f1Button");
var audiobutton5 = document.querySelector("#g1Button");
var audiobutton6 = document.querySelector("#a1Button");
var audiobutton7 = document.querySelector("#b1Button");
var c1 = new Audio("Piano/c1.mp3");
var d1 = new Audio("Piano/d1.mp3");
var e1 = new Audio("Piano/e1.mp3");
var f1 = new Audio("Piano/f1.mp3");
var g1 = new Audio("Piano/g1.mp3");
var a1 = new Audio("Piano/a1.mp3");
var b1 = new Audio("Piano/b1.mp3");
var metronome = new Audio("Piano/tick.wav");
var artiesten = ["Mozart", "Beethoven", "Chopin"];
var i;



function dagartiest(artiesten)  {               //kiest een random artiest uit de array

    return artiesten[Math.floor(Math.random()* artiesten.length)];

}

for (i = 0; i < artiesten.length; i+=1) {       //Laat alle artiesten uit de array in de console zien

    console.log(artiesten[i]);
}

function playAudio() {                          //speel de noot c1

    c1.play();
    c1.currentTime =0;
}

function playAudio1() {                         //speel de noot d1

    d1.play();
    d1.currentTime =0;
}

function playAudio2() {                         //speel de noot e1

    e1.play();
    e1.currentTime =0;
}

function playAudio3() {                         //speel de noot f1

    f1.play();
    f1.currentTime =0;
}

function playAudio4() {                         //speel de noot g1

    g1.play();
    g1.currentTime =0;
}

function playAudio5() {                         //speel de noot a1

    a1.play();
    a1.currentTime =0;
}

function playAudio6() {                         //speel de noot b1

    b1.play();
    b1.currentTime =0;
}


function playMetronome(){
    playing = setTimeout(playMetronome, 500);   //speel elke halve seconde metronome af
    metronome.play();
}


function stopMetronome(){                       //stop timeout van de metronome
        clearTimeout(playing);
}

document.onkeydown = function(e) {              //speel de noot c1 als de a toets is ingedrukt
    if (e.which === 65){
        c1.play();
        c1.currentTime =0;
        document.getElementById("c1Button").classList.add("c1active");

    }   else if (e.which === 83){               //speel de noot d1 als de s toets is ingedrukt
        d1.play();
        d1.currentTime =0;
        document.getElementById("d1Button").classList.add("d1active");

    }   else if (e.which === 68){               //speel de noot e1 als de d toets is ingedrukt
        e1.play();
        e1.currentTime =0;
        document.getElementById("e1Button").classList.add("e1active");

    }   else if (e.which === 70){               //speel de noot f1 als de f toets is ingedrukt
        f1.play();
        f1.currentTime =0;
        document.getElementById("f1Button").classList.add("f1active");

    }   else if (e.which === 71){               //speel de noot g1 als de g toets is ingedrukt
        g1.play();
        g1.currentTime =0;
        document.getElementById("g1Button").classList.add("g1active");

    }   else if (e.which === 72){               //speel de noot a1 als de h toets is ingedrukt
        a1.play();
        a1.currentTime =0;
        document.getElementById("a1Button").classList.add("a1active");

    }   else if (e.which === 74){               //speel de noot b1 als de j toets is ingedrukt
        b1.play();
        b1.currentTime =0;
        document.getElementById("b1Button").classList.add("b1active");

    }
};


document.onkeyup = function(e){                 //verander css als een toets omhoog gaat
        document.getElementById("c1Button").classList.remove("c1active");
        document.getElementById("d1Button").classList.remove("d1active");
        document.getElementById("e1Button").classList.remove("e1active");   
        document.getElementById("f1Button").classList.remove("f1active");
        document.getElementById("g1Button").classList.remove("g1active");
        document.getElementById("a1Button").classList.remove("a1active");
        document.getElementById("b1Button").classList.remove("b1active");
};


document.getElementById("title").innerHTML = "Artiest van de dag: " + dagartiest(artiesten);
audiobutton1.addEventListener("click", playAudio, false);
audiobutton2.addEventListener("click", playAudio1, false);
audiobutton3.addEventListener("click", playAudio2, false);
audiobutton4.addEventListener("click", playAudio3, false);
audiobutton5.addEventListener("click", playAudio4, false);
audiobutton6.addEventListener("click", playAudio5, false);
audiobutton7.addEventListener("click", playAudio6, false);
metronomebutton.addEventListener("click", playMetronome);
stopmetronomebutton.addEventListener("click", stopMetronome);
document.addEventListener("load", dagartiest);

以下は、そのエラーです。

Undeclared 'Audio'.
var c1 = new Audio("Piano/c1.mp3");
15.13Undeclared 'Audio'.
var d1 = new Audio("Piano/d1.mp3");
16.13Undeclared 'Audio'.
var e1 = new Audio("Piano/e1.mp3");
17.13Undeclared 'Audio'.
var f1 = new Audio("Piano/f1.mp3");
18.13Undeclared 'Audio'.
var g1 = new Audio("Piano/g1.mp3");
19.13Undeclared 'Audio'.
var a1 = new Audio("Piano/a1.mp3");
20.13Undeclared 'Audio'.
var b1 = new Audio("Piano/b1.mp3");
21.20Undeclared 'Audio'.
var metronome = new Audio("Piano/tick.wav");
27.0This function needs a "use strict" pragma.
function dagartiest(artiesten)  {               //kiest een random artiest uit de array
33.0Expected 'for' to be in a function.
for (i = 0; i < artiesten.length; i+=1) {       //Laat alle artiesten uit de array in de console zien
38.0This function needs a "use strict" pragma.
function playAudio() {                          //speel de noot c1
44.0This function needs a "use strict" pragma.
function playAudio1() {                         //speel de noot d1
50.0This function needs a "use strict" pragma.
function playAudio2() {                         //speel de noot e1
56.0This function needs a "use strict" pragma.
function playAudio3() {                         //speel de noot f1
62.0This function needs a "use strict" pragma.
function playAudio4() {                         //speel de noot g1
68.0This function needs a "use strict" pragma.
function playAudio5() {                         //speel de noot a1
74.0This function needs a "use strict" pragma.
function playAudio6() {                         //speel de noot b1
81.0This function needs a "use strict" pragma.
function playMetronome(){
87.0This function needs a "use strict" pragma.
function stopMetronome(){                       //stop timeout van de metronome
91.21This function needs a "use strict" pragma.
document.onkeydown = function(e) {              //speel de noot c1 als de a toets is ingedrukt
131.19This function needs a "use strict" pragma.
document.onkeyup = function(e){                 //verander css als een toets omhoog gaat

JSHintは何もエラーを出しません。

また、なぜ Audio が未宣言であることに文句を言うのか、どなたかお分かりになれば幸いです。

解決方法は？

JSLintは、作者であるDouglas Crockfordが適切と考えるルールを強制的に適用します。その1つが、ストリクトモードでコードを書くことを要求することです。 (これがベストプラクティスであることに、私はたまたま同意します）。

残念なことに、JSLintは、あなたが "use strict"; をファイルの先頭に置くことは、ブラウザをターゲットにしていると伝えた場合、奇妙なことになります（これは完全に合理的なことなのですが）。

つまり、あなたの選択肢は

1. 置く "use strict"; をすべての関数の先頭に追加してください。

2. ブラウザをターゲットにしていることを告げずに、すべてのグローバルを自分で供給し、さらに "use strict"; をファイルの先頭に追加してください。

   "use strict";
   /*jslint browser: false, devel: true,  white: true, long: true, for: true*/
   /*global
   clearInterval, clearTimeout, document, event, FileReader, FormData, history, localStorage, location, name, navigator, screen, sessionStorage, setInterval, setTimeout, Storage, URL, window, XMLHttpRequest
   */
   /*eslint-env browser*/
   /*eslint 'no-console':0*/
   
   var metronomebutton = document.querySelector("#playMetronome");
   var stopmetronomebutton = document.querySelector("#stopMetronome");
   // ...
   
   

3. のように、他のものを使用します。 ESLint . (そして、そのコードにはESLint指向のコメントがいくつかありますね。) これは、より良いドキュメントと、ルールに対するより多くの制御を提供します。例えば、これに相当するのは strict ルールが文書化されています ここで .