Đơn giản. Nhìn rất bình thường, nó gần như an ủi:
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
Tuy nhiên, điều gì sẽ xảy ra nếu tôi bao gồm một thư viện javascript thực sự tiện dụng vào trang của mình để dịch các ký tự nâng cao thành các biểu diễn cấp cơ sở của chúng?
Đợi ... cái gì?
Ý tôi là, nếu ai đó gõ một ký tự có một số điểm nhấn vào nó, nhưng tôi chỉ muốn các ký tự 'tiếng Anh' AZ trong chương trình của tôi? Chà ... các ký tự 'é' của Tây Ban Nha và tiếng Pháp có thể được dịch thành các ký tự cơ bản của 'n' và 'e'.
Vì vậy, một người tốt bụng đã viết một trình chuyển đổi nhân vật toàn diện ra khỏi đó mà tôi có thể đưa vào trang web của mình ... Tôi bao gồm nó.
Một vấn đề: nó có một chức năng trong đó gọi là 'name' giống như chức năng của tôi.
Đây là những gì được gọi là va chạm. Chúng ta có hai hàm được khai báo trong cùng một phạm vi có cùng tên. Chúng tôi muốn tránh điều này.
Vì vậy, chúng ta cần phải phạm vi mã của chúng tôi bằng cách nào đó.
Cách duy nhất để phạm vi mã trong javascript là bọc nó trong một hàm:
function main() {
// We are now in our own sound-proofed room and the
// character-converter libarary's name() function can exist at the
// same time as ours.
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
Điều đó có thể giải quyết vấn đề của chúng tôi. Tất cả mọi thứ bây giờ được bao quanh và chỉ có thể được truy cập từ trong niềng răng mở và đóng của chúng tôi.
Chúng tôi có một chức năng trong một chức năng ... thật kỳ lạ khi xem xét, nhưng hoàn toàn hợp pháp.
Chỉ có một vấn đề. Mã của chúng tôi không hoạt động. Biến userName của chúng tôi không bao giờ được lặp lại trong bảng điều khiển!
Chúng tôi có thể giải quyết vấn đề này bằng cách thêm một cuộc gọi vào chức năng của chúng tôi sau khối mã hiện tại của chúng tôi ...
function main() {
// We are now in our own sound-proofed room and the
// character-converter libarary's name() function can exist at the
// same time as ours.
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
main();
Hoặc trước!
main();
function main() {
// We are now in our own sound-proofed room and the
// character-converter libarary's name() function can exist at the
// same time as ours.
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
Một mối quan tâm thứ yếu: cơ hội mà tên 'chính' chưa được sử dụng là gì? ... rất, rất mỏng
Chúng tôi cần phạm vi THÊM. Và một số cách để tự động thực hiện hàm main () của chúng tôi.
Bây giờ chúng ta đến với các chức năng tự động thực hiện (hoặc tự thực thi, tự chạy, bất cứ điều gì).
((){})();
Cú pháp lúng túng như tội lỗi. Tuy nhiên, nó hoạt động.
Khi bạn bọc một định nghĩa hàm trong ngoặc đơn và bao gồm một danh sách tham số (một tập hợp hoặc dấu ngoặc đơn khác!), Nó hoạt động như một lệnh gọi hàm .
Vì vậy, hãy xem lại mã của chúng tôi, với một số cú pháp tự thực hiện:
(function main() {
var userName = "Sean";
console.log(name());
function name() {
return userName;
}
}
)();
Vì vậy, trong hầu hết các hướng dẫn bạn đọc, giờ đây bạn sẽ bị bắn phá với thuật ngữ 'tự thực hiện ẩn danh' hoặc một cái gì đó tương tự.
Sau nhiều năm phát triển nghề nghiệp, tôi mạnh mẽ kêu gọi bạn để đặt tên mỗi chức năng bạn viết cho mục đích gỡ lỗi.
Khi có sự cố xảy ra (và nó sẽ xảy ra), bạn sẽ kiểm tra backtrace trong trình duyệt của mình. Việc thu hẹp các vấn đề về mã của bạn luôn dễ dàng hơn khi các mục trong theo dõi ngăn xếp có tên!
Rất dài và tôi hy vọng nó sẽ giúp!