¿Por qué ciertas llamadas a funciones se denominan "invocaciones ilegales" en JavaScript?

Por ejemplo, si hago esto:

var q = document.querySelectorAll;

q('body');

Recibo un error de "Invocación ilegal" en Chrome. No puedo pensar en ninguna razón por la que esto sea necesario. Por un lado, no es el caso de todas las funciones de código nativo. De hecho puedo hacer esto:

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

var x = new o();

Y todo funciona bien. En particular, he descubierto este problema al tratar con documentos y consolas. ¿Alguna idea?

Es porque ha perdido el "contexto" de la función.

Cuando usted llama:

document.querySelectorAll()

el contexto de la función es documenty será accesible thismediante la implementación de ese método.

Cuando simplemente llamas q, ya no hay contexto, sino el windowobjeto "global" .

La implementación de querySelectorAllintenta usar thispero ya no es un elemento DOM, es un Windowobjeto. La implementación intenta llamar a algún método de un elemento DOM que no existe en un Windowobjeto y, como era de esperar, el intérprete llama a foul.

Para resolver esto, use .binden versiones más recientes de Javascript:

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

lo que asegurará que todas las invocaciones posteriores de qtengan el contexto correcto. Si no lo tiene .bind, use esto:

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

En mi caso, se produjo una invocación ilegal debido al paso de una variable no declarada para que funcione como argumento. Asegúrese de declarar la variable antes de pasar a la función.

puedes usar así:

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

Una solución más concisa:

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