lý do đằng sau JSLint nói có "quá nhiều báo cáo var"

Question

JSLint (với cờ onevar bật) là gì đang giảm sút một số mã javascript mà tôi có như sau:

Problem at line 5 character 15: Too many var statements.

Tôi vui mừng sửa các lỗi này, nhưng tôi muốn biết, tôi có đang thực hiện nó cho hiệu suất hay không vì nó chỉ là một thực hành không tốt và có tiềm năng lớn hơn để giới thiệu các lỗi trong mã javascript của tôi. Lý do đằng sau cờ onevar là gì?

Tôi đã xem các tài liệu JSLint cho var keyword nhưng nó không cụ thể nói về lý do tại sao nhiều câu lệnh var trong cùng một hàm là xấu.

Đây là một ví dụ. Giải thích cách mã sẽ được hưởng lợi từ chỉ có 1 var tuyên bố:

function Test(arg) { 
    var x = arg + 1, 
     y = cache.GetItem('xyz'); 
    if (y !== null) { 
     // This is what would cause the warning in JSLint 
     var request = ajaxPost(/* Parameters here */); 

    } 
} 

Answer 1

Javascript không có phạm vi chặn. Trong các ngôn ngữ khác với nó (như c), nếu bạn khai báo một biến trong câu lệnh if, bạn không thể truy cập nó bên ngoài nó, nhưng trong javascript bạn có thể. Tác giả của JSLint tin rằng đó là một thực hành tồi, vì bạn (hoặc những độc giả khác) có thể bị lẫn lộn và nghĩ rằng bạn không còn có thể truy cập vào biến đó nữa, nhưng bạn thực sự có thể. Vì vậy, bạn nên khai báo tất cả các biến của bạn ở trên cùng của hàm.

Answer 2

Chỉ cần một đoán ở đây, nhưng nó có thể là thời gian cho functional decomposition. Các chức năng nên làm một điều và thực hiện tốt.

Quá nhiều vars là gợi ý về chức năng đang cố gắng thực hiện quá nhiều. Hoặc một trường hợp bạn nên sử dụng một mảng.

Answer 3

Nếu tùy chọn "onevar" được đặt thành true nếu chỉ cho phép một câu lệnh var cho mỗi hàm.

if (funct['(onevar)'] && option.onevar) { 
    warning("Too many var statements."); 
} 

Answer 4

Ý tưởng là bạn nên sử dụng một đối tượng thay vì các vars riêng lẻ. Vì vậy, nơi bạn có được:

var x = arg + 1, 
    y = cache.GetItem('xyz'); 

Thay đổi nó để:

var dimensions = {}; 
dimensions.x = arg + 1; 
dimensons.y = cache.GetItem('xyz'); 
dimensions.request = ... 

Sau đó bạn có thể truy cập các biến thông qua các đối tượng, gọn gàng của nó để có một đối tượng cho mỗi chức năng để chứa các biến chức năng. Sau đó, bạn sẽ không nhận được cảnh báo.

Answer 5

Chỉ cần khai báo VAR của bạn ở một nơi như thế này:

var request,x,y; 

Answer 6

Lý do chính thức is here, bởi Douglas Crockford.

Để quote:

Trong nhiều ngôn ngữ, một khối giới thiệu một phạm vi. Các biến được giới thiệu trong một khối không hiển thị bên ngoài khối.

Trong JavaScript, các khối không giới thiệu phạm vi. Chỉ có phạm vi chức năng. Một biến được giới thiệu ở bất kỳ đâu trong hàm là hiển thị ở mọi nơi trong hàm. Các khối JavaScript gây nhầm lẫn lập trình viên có kinh nghiệm và dẫn đến lỗi vì cú pháp quen thuộc đưa ra một lời hứa sai.

JSLint dự kiến ​​chặn bằng chức năng, nếu, chuyển, trong khi, cho, làm và thử các câu lệnh và không nơi nào khác.

Trong các ngôn ngữ có phạm vi khối, thường được đề xuất rằng các biến số được khai báo tại trang web sử dụng đầu tiên. Nhưng vì JavaScript không có phạm vi khối, nên khôn ngoan hơn để khai báo tất cả các biến số của hàm ở đầu hàm. Chúng tôi đề nghị sử dụng một câu lệnh var var cho mỗi hàm. Điều này có thể bị từ chối với tùy chọn vars .

Answer 7

Lý do đã được mô tả.

Khuyến nghị là sử dụng hình thức này:

var myVar1 = document.getElementById("myDiv1"), 
    myVar2 = document.getElementById("myDiv2"); 

hay này:

var myVar1, myVar2; 
myVar1 = document.getElementById("myDiv1"); 
myVar2 = document.getElementById("myDiv2"); 

Nhưng điều này không trông rất đẹp, đặc biệt là nếu bạn muốn ghi lại vars.

Vì vậy, bạn chỉ có thể vô hiệu hóa cảnh báo này temporarly:

/*jslint vars: true*/ 
    /** 
    * @returns {HTMLDivElement} 
    */ 
    var myVar1 = document.getElementById("myDiv1"); 
    /** 
    * @returns {HTMLDivElement} 
    */ 
    var myVar2 = document.getElementById("myDiv2"); 
    /*jslint vars: false*/ 

Cảnh báo: hãy chắc chắn rằng điều này được thực hiện ở phía trên cùng của một hàm.

Tôi nghĩ rằng điều này được thực hiện vì jslint không thể xác định một cách đáng tin cậy nếu các vars được khai báo ở trên cùng của hàm hay không.