Почему я должен вызывать () JS-функцию push () и переустанавливать ее, чтобы получить ожидаемые результаты?

Question

Я читал исходный код ki.js и наткнулся на странное использование функции call () (см. function i(a) на GitHub).Сначала я упростил эту функцию i(a) для моих целей, теперь функция выглядит следующим образом:

function ki(selector, arr) {
    document.querySelectorAll(selector).forEach((el) => { arr.push.call(this, el); }); 
}

Когда я вызываю свою функцию следующим образом: new ki(".test", []);, я получаю ожидаемый результат - объект собъекты DOM и свойство prototype скопированы из прототипа функции ki ().
Но когда я просто немного изменил функцию ki () на это: (удалив, на мой взгляд, ненужную функцию call ()):

function ki(selector, arr) {
    document.querySelectorAll(selector).forEach((el) => { arr.push(el); }); 
}

Выполнение new ki(".test", []); приведет к объекту без каких-либо объектов DOM, только со свойством прототипа, унаследованным конструктором.

Это то, чего я не понимаю.Почему необходимо манипулировать исходным кодом array.prototype.push () (замена this на this в другом контексте)?Кроме того, этот код также будет работать при использовании в строгом режиме?
Спасибо за любую помощь.

Answer 1

first arr.push(el) также можно записать как arr.push.call(arr, el). выглядит знакомо?

Но this! == arr в вашем коде.

В этом коде arr.push.call(...) используется как сокращение для Array.prototype.push.call(...). Другой распространенный способ написания этого - [].push.call(...).

Sidenote: подождите, пока не дойдете до кода, подобного Function.prototype.apply.call (...)

Answer 2

Если функция ki используется в качестве конструктора, то объекты el помещаются не в массив arr, а в значение this , которое будет созданным объектом

arr =  new Array
arr2 =  new Array

document.querySelectorAll('a').forEach((el) => { arr2.push.call(arr, el); }) 

Надеюсь, это поможет