在JSLint错误中验证jQuery

时间:2014-01-02 22:52:09

标签: javascript jquery

刚刚遇到JSLint因此决定通过它传递我的JS但是有很多错误但不确定它们是不是很糟糕。我已经尝试了一些我在网上找到的东西来摆脱它们,但似乎无法做出让步。

JS代码

$( document ).ready(function() {
!function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0],
        p = /^http:/.test(d.location) ? 'http' : 'https';
    if (!d.getElementById(id)) {
        js = d.createElement(s);
        js.id = id;
        js.src = p + "://platform.twitter.com/widgets.js";
        fjs.parentNode.insertBefore(js, fjs);
    }
}(document, "script", "twitter-wjs");
$('div.icon').click(function () {
    $('input#search').focus();
});
function search() {
    var query_value = $('input#search').val();
    $('b#search-string').html(query_value);
    if (query_value !== '') {
        $.ajax({
            type: "POST",
            url: "../_Scripts/search.php",
            data: {
                query: query_value
            },
            cache: false,
            success: function (html) {
                $("#results").html(html);
            }
        });
    }
    return false;
}
$("input#search").on("keyup", function (e) {
    clearTimeout($.data(this, 'timer'));
    var search_string = $(this).val();
    if (search_string == '') {
        $("#results").fadeOut();
        $('h4#results-text').fadeOut();
    } else {
        $("#results").fadeIn();
        $('h4#results-text').fadeIn();
        $(this).data('timer', setTimeout(search, 100));
    };
});
$('#pmForm').on('submit', function (e) {
    e.preventDefault();
    $('input[type=submit]', this).attr('disabled', 'disabled');
    var pmSubject = $("#pmSubject", this).val();
    var pmTextArea = $("#pmTextArea", this).val();
    var url = "../_Scripts/private_msg_parse.php";
    if (!pmSubject) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type a subject.').show().fadeOut(6000);
        return false;
    } else if (!pmTextArea) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type in your message.').show().fadeOut(6000);
        return false;
    } else {
        $("#pmFormProcessGif").show();
        $.post(url, $('#pmForm').serialize(), function (data) {
            $("#jqueryReply").html(data).show().fadeOut(10000);
            $("#pmTextArea").val('');
            $("#pmSubject").val('');
            $('input[type=submit]', this).removeAttr('disabled');
            $("#pmFormProcessGif").hide();
        });
    }
});

$('#newblog').on('submit', function (e) {
    e.preventDefault();
    $('input[type=submit]', this).attr('disabled', 'disabled');
    var blogTitle = $("#blogtitle").val();
    var blogText = CKEDITOR.instances['blogbody'].getData();
    var url = "../_Scripts/post-blog.php";
    if (!blogTitle) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type a Title.').show().fadeOut(6000);
        return false;
    } else if (!blogText) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type in your Blog.').show().fadeOut(6000);
        return false;
    } else {
        $("#blogFormProcessGif").show();
        for (instance in CKEDITOR.instances) {
            CKEDITOR.instances['blogbody'].updateElement();
        }
        $.post(url, $('#newblog').serialize(), function (data) {
            $("#jqueryReply").html(data).show().fadeOut(10000);
            $("#blogtitle").val('');
            CKEDITOR.instances['blogbody'].setData('');
            $("#blogFormProcessGif").hide();
            location.reload();
        });
    }
});

function _(x) {
    return document.getElementById(x);
};

function report(id, uid) {
    var url = "../_Scripts/report.php";
    $.post(url, {
        blogid: id,
        userid: uid
    }, function (data) {
        alert(data);
    });
};

function toggleElement(x) {
    var x = _(x);
    if (x.style.display == 'block') {
        x.style.display = 'none';
    } else {
        x.style.display = 'block';
    }
};

var friendRequestURL = "../_Scripts/request_as_friend.php";

function addAsFriend(a, b) {
    $("#add_friend_loader").show();
    $.post(friendRequestURL, {
        request: "requestFriendship",
        mem1: a,
        mem2: b
    }, function (data) {
        $("#jqueryReply").html(data).show().fadeOut(6000);
    });
};

function acceptFriendRequest(x) {
    $.post(friendRequestURL, {
        request: "acceptFriend",
        reqID: x
    }, function (data) {
        $("#frequestreply").html(data).show();
    });
};

function denyFriendRequest(x) {
    $.post(friendRequestURL, {
        request: "denyFriend",
        reqID: x
    }, function (data) {
        $("#frequestreply").html(data).show();
    });
};

function removeAsFriend(a, b) {
    $("#remove_friend_loader").show();
    $.post(friendRequestURL, {
        request: "removeFriendship",
        mem1: a,
        mem2: b
    }, function (data) {
        $("#jqueryReply").html(data).show().fadeOut(6000);
        location.reload();
    });
};
});
var date = new Date().getFullYear();
$('#year_' + date).children('ul').addClass('active').children('li').slideDown();
$('#' + date).children('img').attr("src", "../_Images/arrow-down.gif");
$('li:not(.recent)').click(function (e) {
    if ($(this).find('>ul').hasClass('active')) {
        $(this).children('ul').removeClass('active').children('li').slideUp();
        $(this).children('img').attr("src", "../_Images/arrow.gif");
        e.stopPropagation();
    } else {
        $(this).children('ul').addClass('active').children('li').slideDown();
        $(this).children('img').attr("src", "../_Images/arrow-down.gif");
        e.stopPropagation();
    }
});

错误:

'$' was used before it was defined.
$( document ).ready(function() {
line 1 character 4Unexpected space between '(' and 'document'.
$( document ).ready(function() {
line 1 character 13Unexpected space between 'document' and ')'.
$( document ).ready(function() {
line 1 character 29Expected exactly one space between 'function' and '('.
$( document ).ready(function() {
line 2 character 1Missing 'use strict' statement.
!function (d, s, id) {
line 3 character 5Expected 'var' at column 9, not column 5.
    var js, fjs = d.getElementsByTagName(s)[0],
line 4 character 9Expected 'p' at column 13, not column 9.
        p = /^http:/.test(d.location) ? 'http' : 'https';
line 5 character 5Expected 'if' at column 9, not column 5.
    if (!d.getElementById(id)) {
line 6 character 9Expected 'js' at column 13, not column 9.
        js = d.createElement(s);
line 7 character 9Expected 'js' at column 13, not column 9.
        js.id = id;
line 8 character 9Expected 'js' at column 13, not column 9.
        js.src = p + "://platform.twitter.com/widgets.js";
line 9 character 9Expected 'fjs' at column 13, not column 9.
        fjs.parentNode.insertBefore(js, fjs);
line 10 character 5Expected '}' at column 9, not column 5.
    }
line 11 character 1Expected '}' at column 5, not column 1.
}(document, "script", "twitter-wjs");
line 11 character 3Wrap an immediate function invocation in parentheses to assist the reader in understanding that the expression is the result of a function, and not the function itself.
}(document, "script", "twitter-wjs");
line 12 character 1Expected '$' at column 5, not column 1.
$('div.icon').click(function () {
line 13 character 5Expected '$' at column 9, not column 5.
    $('input#search').focus();
line 14 character 1Expected '}' at column 5, not column 1.
});
line 15 character 1Expected 'function' at column 5, not column 1.
function search() {
line 16 character 5Expected 'var' at column 9, not column 5.
    var query_value = $('input#search').val();
line 16 character 23'$' was used before it was defined.
    var query_value = $('input#search').val();
line 17 character 5Expected '$' at column 9, not column 5.
    $('b#search-string').html(query_value);
line 18 character 5Expected 'if' at column 9, not column 5.
    if (query_value !== '') {
line 19 character 9Expected '$' at column 13, not column 9.
        $.ajax({
line 20 character 13Expected 'type' at column 17, not column 13.
            type: "POST",
line 21 character 13Expected 'url' at column 17, not column 13.
            url: "../_Scripts/search.php",
line 22 character 13Expected 'data' at column 17, not column 13.
            data: {
line 23 character 17Expected 'query' at column 21, not column 17.
                query: query_value
line 24 character 13Expected '}' at column 17, not column 13.
            },
line 25 character 13Expected 'cache' at column 17, not column 13.
            cache: false,
line 26 character 13Expected 'success' at column 17, not column 13.
            success: function (html) {
line 27 character 17Expected '$' at column 21, not column 17.
                $("#results").html(html);
line 28 character 13Expected '}' at column 17, not column 13.
            }
line 29 character 9Expected '}' at column 13, not column 9.
        });
line 30 character 5Expected '}' at column 9, not column 5.
    }
line 31 character 5Expected 'return' at column 9, not column 5.
    return false;
line 32 character 1Expected '}' at column 5, not column 1.
}
line 33 character 1Expected '$' at column 5, not column 1.
$("input#search").on("keyup", function (e) {
line 34 character 5Expected 'clearTimeout' at column 9, not column 5.
    clearTimeout($.data(this, 'timer'));
line 34 character 18'$' was used before it was defined.
    clearTimeout($.data(this, 'timer'));
line 35 character 5Expected 'var' at column 9, not column 5.
    var search_string = $(this).val();
line 35 character 25'$' was used before it was defined.
    var search_string = $(this).val();
line 36 character 5Expected 'if' at column 9, not column 5.
    if (search_string == '') {
line 36 character 23Expected '===' and instead saw '=='.
    if (search_string == '') {
line 37 character 9Expected '$' at column 13, not column 9.
        $("#results").fadeOut();
line 38 character 9Expected '$' at column 13, not column 9.
        $('h4#results-text').fadeOut();
line 39 character 5Expected '}' at column 9, not column 5.
    } else {
line 40 character 9Expected '$' at column 13, not column 9.
        $("#results").fadeIn();
line 41 character 9Expected '$' at column 13, not column 9.
        $('h4#results-text').fadeIn();
line 42 character 9Expected '$' at column 13, not column 9.
        $(this).data('timer', setTimeout(search, 100));
line 42 character 9Too many errors. (23% scanned).

任何人都可以对这些错误有所了解,并告诉我他们将来是否会影响我?目前,代码运行良好。

由于

1 个答案:

答案 0 :(得分:1)

JSLint检查代码语法,包括空格,而不仅仅是代码错误。

由于JavaScript的性质,Expected '===' and instead saw '=='.等错误非常严重。在JavaScript中,==表示比较值,而===表示比较值和类型。以下是一些例子:

1 == '1'  // Evaluates to true because it doesn't check for type
1 === '1' // Evaluates to false because it does check for type (they are 
          // different types)

因此,最好使用===而不是==

空白错误/警告,例如

Unexpected space between '(' and 'document'.

Expected '}' at column 9, not column 5.

并不严重,可能不会导致代码的实际性能出现任何问题,但它们有助于提高代码的可读性和清晰度。我建议使用JSLint格式/空格规则,但如果您有自己的有效JavaScript代码格式,请不要过于担心。

JSLint是用于编写JavaSript代码的 标准,而不是 标准。也就是说,JSLint是一个非常好的标准。如果你不关心空格,JSHint是JSLint的一个很好的替代品。 JSHint是JSLint的一个分支,但在无关紧要的地方(即空格)并不严格。

正如上面的评论中所建议的,我建议专注于学习如何编写优秀,干净,可读的JavaScript代码。在大多数情况下,如果您的代码编写良好且可读,JSLint / JSHint将找不到很多错误。有关制作优秀JavaScript代码的更多信息,我建议您查看JSLint发明人Douglas Crockford的 JavaScript: The Good Parts