Khai báo var bên trong Javascript để khai báo vòng lặp

Question

Tôi chắc rằng tôi đã đọc một cuộc thảo luận về SO về điều này nhưng không thể tìm thấy nó. Đơn giản, có khuyết điểm nào để tuyên bố tăng vòng lặp for trong vòng khai báo của vòng lặp không? sự khác biệt giữa điều này là gì:

function foo() { 
    for (var i=0; i<7; i++) { 
     // code 
    } 
} 

... và điều này:

function foo() { 
    var i; 
    for (i=0; i<7; i++) { 
     // code 
    } 
} 

Kể từ JS có phạm vi chức năng, một trong hai nên được tốt, phải không? Có trường hợp cạnh nào mà cách tiếp cận cũ sẽ gây ra vấn đề?

Nếu chúng giống hệt nhau, tại sao Crockford/JSLint tất cả, "Không có cách nào dawg", về nó?

Answer 1

Đây là chính xác như nhau. Tất cả các biến cục bộ trong javascript đều có phạm vi hàm có nghĩa là chúng đang hoạt động cho toàn bộ hàm mà chúng được khai báo. Điều này thường phản trực giác đầu tiên vì hầu hết các ngôn ngữ dấu ngoặc nhọn đều có phạm vi thời gian sống của biến đó vào khối mà chúng được khai báo.

Một phần của nhà phát triển Javascript rất thích biểu mẫu thứ hai. Lý do là vì tất cả các biến có phạm vi hàm, bạn nên khai báo chúng ở mức hàm để làm cho thời gian sống rõ ràng ngay cả đối với những người không quen với Javascript. Đây chỉ là một phong cách và mặc dù không phải là một quy tắc cứng

EDIT

Lưu ý rằng với sự ra đời của ES6 let, bạn bây giờ có thể sử dụng để cho bên trong vòng lặp của bạn thật khối chỉnh phạm vi biến more details

for(let i = 1; i <= 5; i++) { 
    setTimeout(function(){ 
     console.log('Value of i : ' + i); 
    },100); 
} 

Answer 2

Cả hai đều giống hệt nhau.

Answer 3

Sự cố khi khai báo với var trong tiêu đề vòng lặp là nó lừa đảo. Nó trông như bạn đang khai báo một biến có phạm vi được giới hạn ở những for vòng lặp, khi nó thực sự tồn tại ở khắp mọi nơi trong phạm vi chức năng - bao gồm trước tuyên bố:

var i = 1; 
function foo() { 
    console.log(i);      // 'undefined' 
    for (var i=1; i<100; ++i) { 
    } 
} 

Mặc dù cuộc gọi console.log xảy ra trước tuyên bố của địa phương i, nó vẫn còn trong phạm vi cho nó bởi vì nó bên trong cùng một chức năng. Vì vậy, các địa phương i, mà chưa có bất kỳ giá trị được giao cho nó, là những gì được thông qua để log. Điều này có thể gây ngạc nhiên; nó chắc chắn không hiển nhiên đối với bất kỳ ai không quen thuộc với các quy tắc phạm vi Javascript.

Bắt đầu với ECMAScript 2015, có cách tốt hơn để khai báo biến: let. Các biến được khai báo với let là cục bộ cho khối chứa chúng, chứ không phải toàn bộ hàm. Vì vậy, phiên bản này của các mã trên sẽ in 1 như dự định:

let i=1; // could use var here; no practical difference at outermost scope 
function foo() { 
    console.log(i);    // 1 
    for (let i=1; i<100; ++i) { 
    } 
} 

Vì vậy, thực hành tốt nhất trong Javascript hiện đại là để khai báo các biến với let thay vì var. Tuy nhiên, nếu bạn đang mắc kẹt với một pre-ECMAScript 2015 thực hiện, nó là một chút ít khó hiểu để khai báo tất cả các biến ở trên cùng của hàm, thay vì chờ đợi cho đến khi sử dụng đầu tiên.

Answer 4

Không có sự khác biệt, nhưng tôi thích cách thứ hai (mỗi Crockford) bởi vì nó một cách rõ ràng cho thấy rằng các biến bên ngoài có sẵn của vòng lặp for:

function() { 
    for(var i=0; i<7; i++) { 
     // code 
    } 

    // i is still in scope here and has value 7 
} 

Answer 5

Mã khối hai giống hệt nhau. Câu lệnh đầu tiên của vòng lặp for được thực thi trước khi vòng lặp for bắt đầu, vòng lặp đang chạy trong khi câu lệnh thứ hai là đúng, và câu lệnh thứ ba được chạy mỗi khi vòng lặp lặp lại một lần.

Điều này có nghĩa rằng

for(var i = 0; i < 8; i++) { 
    //some Code 
} 

giống hệt

var i = 0; 
for(;i < 8;) { 
    //some Code 
    i++; 
} 

(Các dấu chấm phẩy sau ( là bảo với máy tính i < 8 thực sự là tuyên bố thứ hai, không phải là lần đầu tiên).