Jslint Is Suddenly Reporting: Use the Function Form of "Use Strict"

JSLint is suddenly reporting: Use the function form of use strict

Include 'use strict'; as the first statement in a wrapping function, so it only affects that function. This prevents problems when concatenating scripts that aren't strict.

See Douglas Crockford's latest blog post Strict Mode Is Coming To Town.

Example from that post:

(function () {
'use strict';
// this function is strict...
}());

(function () {
// but this function is sloppy...
}());

Update:
In case you don't want to wrap in immediate function (e.g. it is a node module), then you can disable the warning.

For JSLint (per Zhami):

/*jslint node: true */

For JSHint:

/*jshint strict:false */

or (per Laith Shadeed)

/* jshint -W097 */

To disable any arbitrary warning from JSHint, check the map in JSHint source code (details in docs).

Update 2: JSHint supports node:boolean option. See .jshintrc at github.

/* jshint node: true */

jshint: 'use the function form of use strict' and 'document is not defined' in simple javascript file

You’ll need to set the strict option to prefer a global 'use strict', and the browser option to tell JSHint that your script targets browsers.

.jshintrc

{
"esversion": 6,
"browser": true,
"strict": "global"
}

And yes, “W” at the beginning of a code means “warning”.

jshint use strict issue

The issue is that if you don't use the function form it applies to everything, and not just your code. The solution to that is to scope use strict inside functions you control.

Refer to this question: JSLint is suddenly reporting: Use the function form of “use strict”.

Rather than doing

"use strict";

angular.module('appApp')
.controller('MainCtrl', ['$scope', function ($scope) {
$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
}]);

You should be doing

angular.module('appApp')
.controller('MainCtrl', ['$scope', function ($scope) {
"use strict";

$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
}]);

It's either that or wrapping your code in a self-executing closure, like below.

(function(){
"use strict";

// your stuff
})();

How to use strict mode and not get an error in JSlint

In modern JavaScript, inline handlers should be avoided whenever possible since they require global pollution, require ugly quote escaping with some arguments, and have absurd scope chain rules. So, try removing the inline handlers and put your JavaScript into an IIFE, which can be made strict:

(() => {
"use strict";

function foo() {
$('#example').text('Hello ' + bar());
}

function bar() {
return 'Beautiful';
}
window.addEventListener('DOMContentLoaded', foo);
})();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
<p id='example'>
</p>
</body>

JSLint This function needs a use strict pragma.

JSLint enforces rules that its author, Douglas Crockford, thinks are appropriate. One of those is to require that you write code in strict mode. (I happen to agree that this is best practice.)

Unfortunately, JSLint also complains if you put "use strict"; at the top of the file if you tell it you're targeting a browser (which is bizarre, as that's it's a perfectly reasonable thing to do).

So your choices are:

  1. Put "use strict"; at the top of every function.

  2. Don't tell it you're targeting a browser, supply all the globals yourself, and add "use strict"; at the top of the file:

    "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. Use something else, like ESLint. (And I notice you have a couple of ESLint-oriented comments in that code.) It offers better documentation and more control over the rules. For instance, its equivalent of this strict rule is documented here.

JSLint is suddenly reporting: Use the function form of use strict

Include 'use strict'; as the first statement in a wrapping function, so it only affects that function. This prevents problems when concatenating scripts that aren't strict.

See Douglas Crockford's latest blog post Strict Mode Is Coming To Town.

Example from that post:

(function () {
'use strict';
// this function is strict...
}());

(function () {
// but this function is sloppy...
}());

Update:
In case you don't want to wrap in immediate function (e.g. it is a node module), then you can disable the warning.

For JSLint (per Zhami):

/*jslint node: true */

For JSHint:

/*jshint strict:false */

or (per Laith Shadeed)

/* jshint -W097 */

To disable any arbitrary warning from JSHint, check the map in JSHint source code (details in docs).

Update 2: JSHint supports node:boolean option. See .jshintrc at github.

/* jshint node: true */

Why do this function get a warning message from JSLint?

function undoActionClick() {
if (history.length <= 1) {
return;
}
history.pop();
contextTmp.putImageData(history[history.length - 1], 0, 0);
updateHistorySelection();
}

This should be ok, it is not an error on your code but is wrong with one rule of JSLint.

More information in the docs



Related Topics



Leave a reply



Submit