What is the reason behind JSHINT flagging this as a strict violation?

Question

What is the reason behind JSHINT flagging this as a strict violation?

I suspect that this could potentially be a duplicate of Strict Violation using the keyword 'this' and the revealing module pattern

Here is the code snippet in question:

function navigateToPage(s){
    if(s<=this.d&&s>0){this.g=s; this.page((s-1)*this.p.size);}
}

function pageTransition(event, sorter) {
    var dd = event.currentTarget;
    navigateToPage.call(sorter, dd[dd.selectedIndex].value);
}

Despite my efforts, JSHINT (or JSLINT) seems to have an issue with it. It specifically highlights "Strict violation." for the marked line.

Do you think utilizing Function.call() followed by referencing the instance is not appropriate in this case?

Could this be viewed as poor coding etiquette?

javascript jslint strict jshint

Answer 1

Answer №1

According to JSHint, a "Possible strict violation" is flagged when you use this within something that appears not to be a method.

In non-strict mode, using gotoPage(5) would bind this to the global object (window in the browser). However, in strict mode, this would be undefined, leading to potential issues.

To ensure intended functionality with a specified this context, consider utilizing methods such as gotoPage.bind(myObj)(5) or gotoPage.call(myObj, 5). By doing so, any JSHint errors can be disregarded. Nevertheless, the use of this in a non-method context can be confusing for others reviewing your code. A clearer approach would be to pass the object as an argument:

function gotoPage(sorter, s) {
    if (s <= sorter.d && s > 0) {
        sorter.g = s;

        sorter.page((s - 1) * sorter.p.size);
    }
}

function pageChange(event, sorter) {
    var dd = event.currentTarget;
    gotoPage(sorter, dd[dd.selectedIndex].value);
}

Answer 2

According to JSHint, a "Possible strict violation" is flagged when you use this within something that appears not to be a method.

In non-strict mode, using gotoPage(5) would bind this to the global object (window in the browser). However, in strict mode, this would be undefined, leading to potential issues.

To ensure intended functionality with a specified this context, consider utilizing methods such as gotoPage.bind(myObj)(5) or gotoPage.call(myObj, 5). By doing so, any JSHint errors can be disregarded. Nevertheless, the use of this in a non-method context can be confusing for others reviewing your code. A clearer approach would be to pass the object as an argument:

function gotoPage(sorter, s) {
    if (s <= sorter.d && s > 0) {
        sorter.g = s;

        sorter.page((s - 1) * sorter.p.size);
    }
}

function pageChange(event, sorter) {
    var dd = event.currentTarget;
    gotoPage(sorter, dd[dd.selectedIndex].value);
}

Answer 3

Answer №2

I once encountered a situation where a message was not capitalized at the beginning of a function.

"use strict";

// ---> violation of strict mode
function example() {
    this.testing = "";
}


// ---> no issues (pay attention to the capital E in Example)
function Example() {
    this.testing = "";
}

Answer 4

I once encountered a situation where a message was not capitalized at the beginning of a function.

"use strict";

// ---> violation of strict mode
function example() {
    this.testing = "";
}


// ---> no issues (pay attention to the capital E in Example)
function Example() {
    this.testing = "";
}

Answer 5

Answer №3

When defining a function as a variable rather than using the standard function declaration, jshint will not identify it as a strict violation. To demonstrate this behavior, you can follow these steps:

var changePage = function (pageNum){
    if(pageNum<=this.totalPages && pageNum>0){this.currentPage=pageNum; this.displayPage((pageNum-1)*this.pageSize);}
};


var selectPage = function (event, sorter) {
    var dropdown = event.currentTarget;
    changePage.call(sorter, dropdown[dropdown.selectedIndex].value);
};

Answer 6

When defining a function as a variable rather than using the standard function declaration, jshint will not identify it as a strict violation. To demonstrate this behavior, you can follow these steps:

var changePage = function (pageNum){
    if(pageNum<=this.totalPages && pageNum>0){this.currentPage=pageNum; this.displayPage((pageNum-1)*this.pageSize);}
};


var selectPage = function (event, sorter) {
    var dropdown = event.currentTarget;
    changePage.call(sorter, dropdown[dropdown.selectedIndex].value);
};

Answer 7

Answer №4

When attempting to incorporate a method, consider assigning it to the prototype like this:

SampleClass.prototype.moveToPage = function moveToPage(page){
  // implementation code here
};

JSHint will not issue any warnings when assigning the function.

Answer 8

When attempting to incorporate a method, consider assigning it to the prototype like this:

SampleClass.prototype.moveToPage = function moveToPage(page){
  // implementation code here
};

JSHint will not issue any warnings when assigning the function.

What is the reason behind JSHINT flagging this as a strict violation?

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Refreshing a page occurs every 30 seconds or upon the user submitting a form

Selecting elements with special characters in their IDs using JQuery can be done

Issues encountered with AES decryption when utilizing CryptoJS

Error encountered in React while using an object in useState: TypeError - Unable to access property 'name' of undefined

Organizing data in a table with AngularJS

Encountering an Issue: Unable to Generate Line Chart with gRaphael Library

Anticipate the desired operations and propose appropriate function identifiers within a generalized class framework

Unable to control the content within the Repeater DIV

The state is not updating in a timely manner

While experimenting with p5.js, I encountered an issue where I received the error message stating that "loadAnimation is not defined and createSprite not defined." This problem persists even when using VSCode

Is there a way to check for invalid string literals within a string?

Using app.get('env') in local development and live production settings

What could be causing the Ajax error to occur in my .Net Data table?

Having trouble setting up email with Passport-local. Any new suggestions?

Finding the Perfect Placement for an Element in Relation to its Companion

What is the process for retrieving information from a retail outlet?

What is the best method to determine if a Django object is null in JavaScript?

Creating an intricate table layout using AngularJS and the ngRepeat directive

Filter your DataTables columns by searching for text within a specific range

Difficulty with AngularJs Translation Partials