Предисловие
С помощью методов Call (), Apply () и Bind () мы можем легко одолжить методы из других объектов, не наследуя его от этих объектов.
Методы заимствования в JavaScript
В JavaScript функции или методы других объектов иногда можно использовать повторно, а не обязательно определяться на самом объекте или на прототипе. С помощью методов Call (), Apply () и Bind () мы можем легко одолжить методы из других объектов, не наследуя их. Это общий метод, используемый профессиональными разработчиками JavaScript.
Прототип метод
В JavaScript, за исключением неизменных примитивных типов данных, таких как строка, число и логическое, почти все данные являются объектами. Массив - это объект, подходящий для пересечения и преобразования упорядоченных последовательностей. Его прототип имеет простые в использовании методы, такие как срез, соединение, толчок и поп.
Распространенным примером является то, что когда как объекты, так и массивы являются структурой данных типа списка, объекты могут «заимствовать» методы из массивов. Наиболее распространенным методом для заимствований является Array.prototype.slice .
function myfunc () {// Ошибка, аргументы - это массив, похожий на объект, а не настоящий массив arcomumts.sort (); // "позаимствовать" срез метода массива из своего прототипа, который принимает массив, подобный объекту (ключ: значение) // и возвращает реальный массив var args = array.prototype.slice.call (аргументы); // ARGS теперь является реальным массивом, поэтому может использовать метод SORT () из Array Args.sort (); } myfunc ('бананы', «вишня», «яблоки»);Методы заимствования работают, потому что методы вызова и применения позволяют вызовым функциям в разных контекстах, что также является хорошим способом повторного использования существующих функций без необходимости наследовать другие объекты. Фактически, массивы определяют много общих методов в прототипах, таких как соединение и фильтр:
// Возьмите строку «abc» и производит «a | b | carray.prototype.join.call ('abc', '|'); // Возьмите строку и удаляет все нексусные карты. ! == -1;}). Join ('' '); Можно видеть, что не только объекты могут занимать методы массива, но и строки. Но поскольку общие методы определяются на прототипе, вы должны использовать String.prototype или Array.prototype каждый раз, когда вы хотите одолжить метод. Письмо, как это, очень многословное и скоро станет раздражающим. Более эффективный способ - использовать литералы для достижения той же цели.
Использование буквальных методов заимствования
Литералы - это синтаксическая структура, которая следует за правилами JavaScript, MDN объясняет это так:
В JavaScript использование литералов может представлять значения. Это фиксированные значения, либо переменные, либо данные буквально в сценарии.
Литералы могут быть сокращены как прототип:
[] .slice.call (аргументы); [].
Это не кажется настолько многословным, но все еще немного уродливо работать непосредственно на [] и «», чтобы одолжить метод. Вы можете использовать переменные для сохранения ссылок на литералы и методы, что облегчает писать:
var slice = [] .slice; slice.call (аргументы); var join = [] .join; join.call ('abc', '|'); var touppercase = '.С ссылками на методы заимствования мы можем легко назвать его с помощью Call (), который также может повторно использовать код. Придерживаясь принципа снижения избыточности, давайте посмотрим, сможем ли мы занимать методы без необходимости писать Call () или применить () Каждый раз, когда мы звоним:
var slice = function.prototype.call.bind (array.prototype.slice); slice (аргументы); var join = function.prototype.call.bind (array.prototype.join); join ('abc', '|'); var touppercase = function.prototype.call.bind (string.prototype.touppercase); touppercase (['' Lowercess ',' words ',' in ',' a ',' предложение ']). Split (', '); Как вы можете видеть, теперь вы можете использовать Function.prototype.call.bind . Но как предложение var slice = Function.prototype.call.bind(Array.prototype.slice) на самом деле работает?
Понять function.prototype.call.bind
Function.prototype.call.bind может показаться немного сложным с первого взгляда, но может быть очень полезно понять, как это работает.
Function.prototype.call - это ссылка, которая «вызывает» функцию и установит свое значение «это» для использования в функции.
Обратите внимание, что «связывать» возвращает новую функцию со своей «это» значением. Следовательно, «эта» новой функции, возвращаемой .bind(Array.prototype.slice) всегда является массивом.
Подводя итог, новая функция вызывает функцию «вызов», а ее функция «это» - это функция «среза». Вызов Slice () будет указывать на ранее квалифицированный метод.
Методы настройки объектов
Наследование великолепно, но разработчики обычно используют его, когда они хотят повторно использовать некоторые общие функции между объектами или модулями. Нет необходимости использовать наследование только для повторного использования кода, потому что в большинстве случаев простые методы заимствования могут быть сложными.
Мы только обсуждали заимствование местных методов, но заимствование любого метода в порядке. Например, следующий код может рассчитать игру игрока очков:
var scoreCalculator = {getSum: function (results) {var score = 0; for (var i = 0, len = Results.length; i <len; i ++) {оценка = оценка+результаты [i]; } return Score; }, getScore: function () {return scorecalculator.getsum (this.results) / this.handicap; }}; var player1 = {результаты: [69, 50, 76], гандикап: 8}; var player2 = {результаты: [23, 4, 58], гандикап: 5}; var chall = function.prototype.call.bind (scoreCalculator.getScore); // оценка: 24.375console.log ('Оценка:' + Оценка (Player1)); // Оценка: 17 -anconole.log ('Оценка:' + Оценка (Player2));Хотя приведенный выше пример очень тупым, видно, что, как и нативные методы, пользовательские методы могут быть легко заимствованы.
Суммировать
Вызов, привязка и применение может изменить способ вызываемых функций, и часто используются при заимствовании функций. Большинство разработчиков знакомы с заимствованием местных методов, но редко заимствуют пользовательские методы.
В последние годы функциональное программирование JavaScript развивалось хорошо. Как использовать function.prototype.call.bind, чтобы занять метод более удобный? По оценкам, такие темы станут все более и более распространенными.
Выше приведено краткое изложение методов заимствования в JavaScript. Я надеюсь, что для всех будет полезно понять методы заимствования в JavaScript.