Tại sao các lệnh gọi hàm nhất định được gọi là “lệnh gọi bất hợp pháp” trong JavaScript?

Ví dụ: nếu tôi làm điều này:

var q = document.querySelectorAll;

q('body');

Tôi gặp lỗi "Lệnh gọi bất hợp pháp" trong Chrome. Tôi không thể nghĩ ra bất kỳ lý do tại sao điều này là cần thiết. Đối với một, nó không phải là trường hợp với tất cả các hàm mã gốc. Trên thực tế, tôi có thể làm điều này:

var o = Object; // which is a native code function

var x = new o();

Và mọi thứ hoạt động tốt. Đặc biệt, tôi đã phát hiện ra vấn đề này khi xử lý tài liệu và bảng điều khiển. Có suy nghĩ gì không?

Đó là bởi vì bạn đã mất "ngữ cảnh" của hàm.

Khi bạn gọi:

document.querySelectorAll()

ngữ cảnh của chức năng đang documentvà sẽ có thể truy cập được khi thisthực hiện phương pháp đó.

Khi bạn vừa gọi q, không còn ngữ cảnh nữa - windowthay vào đó là đối tượng "toàn cục" .

Việc triển khai querySelectorAllcố gắng sử dụng thisnhưng nó không còn là một phần tử DOM nữa, nó là một Windowđối tượng. Việc triển khai cố gắng gọi một số phương thức của phần tử DOM không tồn tại trên một Windowđối tượng và trình thông dịch không ngạc nhiên gọi là lỗi.

Để giải quyết vấn đề này, hãy sử dụng .bindtrong các phiên bản Javascript mới hơn:

var q = document.querySelectorAll.bind(document);

điều này sẽ đảm bảo rằng tất cả các lệnh gọi tiếp theo của qđều có ngữ cảnh phù hợp. Nếu bạn chưa có .bind, hãy sử dụng cái này:

function q() {
    return document.querySelectorAll.apply(document, arguments);
}

Trong trường hợp của tôi, đã xảy ra lệnh gọi bất hợp pháp do chuyển biến không khai báo cho hàm làm đối số. Đảm bảo khai báo biến trước khi chuyển đến hàm.

bạn có thể sử dụng như thế này:

let qsa = document.querySelectorAll;
qsa.apply(document,['body']);

Một giải pháp ngắn gọn hơn:

const q=s=>document.querySelectorAll(s);
q('body');