Перед обсуждением метода bind () давайте посмотрим на вопрос:
var altwrite = document.write;
altwrite ("Привет");
// 1. В чем проблема с приведенным выше кодом?
// 2. Какова правильная операция
// 3. Как реализовать метод bind ()
Для приведенного выше вопроса ответ не слишком сложный. Основной тестовой точкой является проблема, на которую указывает это. Функция altWrite () изменяет это указывает на глобальные или оконные объекты, вызывая ненормальный вызов во время выполнения. Правильным решением является использование метода bind ():
altwrite.bind (документ) ("Привет")
Конечно, вы также можете использовать метод Call ():
altwrite.call (документ, "Привет")
В центре внимания этой статьи - обсудить реализацию метода Bind () в третьем вопросе. Прежде чем мы начнем обсуждать реализацию bind (), давайте посмотрим на использование метода bind ():
Функция связывания
Самый простой способ использования bind () - создать функцию, чтобы функция имела одинаковое значение, независимо от того, как она называется. Общие ошибки похожи на пример выше, выводя метод из объекта, затем вызывая его и желая, чтобы это указывало на исходный объект. Если не будет выполнено особое лечение, исходный объект, как правило, будет потерян. Использование метода bind () может прекрасно решить эту проблему:
this.num = 9; var mymodule = {num: 81, getNum: function () {return this.num; }}; module.getnum (); // 81Var getNum = module.getNum; getNum (); // 9, потому что в этом примере «этот» указывает на глобальный объект // создание функции, которая связана с модулем var boundgetnum = getnum.bind (module); BoundgetNum (); // 81Частичные функции
Частичные функции также называются частичными приложениями. Вот раздел определений о частичных функциях:
Частичное приложение может быть описано как принятие функции, которая принимает некоторое количество аргументов, связывание значений с одним или несколькими из этих аргументов и возвращение новой функции, которая принимает только оставшиеся, не связанные с ними аргументы.
Это хорошая особенность. Используя bind () Мы устанавливаем предопределенные параметры функции, а затем передаем другие параметры при вызове:
function list () {return array.prototype.slice.call (аргументы);} var list1 = list (1, 2, 3); // [1, 2, 3] // Предварительно определенный параметр 37VAR LoderThirtySevenlist = list.Bind (Undefined, 37); var list2 = adderthirtySevenlist (); // [37] var list3 = LeadingThirtySevenList (1, 2, 3); // [37, 1, 2, 3]Используйте с SetTimeout
Как правило, этот settimeout () указывает на окно или глобальный объект. При использовании метода класса это необходимо указывать на экземпляр класса, вы можете использовать Bind (), чтобы привязать его с функцией обратного вызова для управления экземпляром.
function bloomer () {this.petalCount = math.ceil (math.random () * 12) + 1;} // вызовать функцию объявления bloomer.prototype.bloom = function () {window.settimeout (this.declare.bind (this), 1000);}; bloomer.prototype.declare = function () {use.log. this.petalcount + 'Petal!');};Примечание. Приведенный выше метод также можно использовать для функций обработки событий и методов SetInterval.
Связывать функцию как конструктор
Функции связывания также подходят для использования нового оператора для построения экземпляров целевой функции. При использовании функций привязки для построения экземпляра примечание. Это будет игнорировано, но пропущенные параметры все еще доступны.
Функциональная точка (x, y) {this.x = x; this.y = y;} point.prototype.tostring = function () {return this.x + ',' + this.y; }; var p = новая точка (1, 2); P.ToString (); // '1,2'var emptyObj = {}; var yaxispoint = point.bind (umptyBj, 0/*x*/); // Примеры в реализации не поддерживаются, // Нативные опоры связывания: var yaxispoint = point.bind (null, 0/*x*/); var axispoint = new Yaxispoint (5); axispoint.tostring (); // '0,5'AxIspoint ancessionof point; // истинный экземпляр yaxispoint; // истинная новая точка (17, 42) экземпляр Yaxispoint; // истинныйВ приведенном выше примере точечные и Yaxispoint используют прототипы, так что это верно при оценке с использованием оператора экземпляра.
ярлык
bind () также может создавать ярлыки для функций, которые требуют определенного значения этого.
Например, чтобы преобразовать массив объекта класса в реальный массив, возможные примеры заключаются в следующем:
var slice = array.prototype.slice; // ... slice.call (аргументы);
Если вы используете bind (), ситуация становится проще:
var unboundslice = array.prototype.slice; var slice = function.prototype.call.bind (unboundslice); // ... slice (аргументы);
выполнить
В вышеупомянутых разделах вы можете видеть, что Bind () имеет много сценариев использования, но функция Bind () была добавлена в пятой версии ECMA-262; Это может не работать на всех браузерах. Это требует, чтобы мы сами реализовали функцию bind ().
Во -первых, мы можем просто реализовать метод bind (), указав область целевой функции:
Function.prototype.bind = function (context) {self = this; // Сохранить это, то есть целевая функция, которая вызывает метод Bind возвращает function () {return self.apply (контекст, аргументы); };};Принимая во внимание каррию функции, мы можем построить более надежный Bind ():
Function.prototype.bind = function (context) {var args = array.prototype.slice.call (аргументы, 1), self = this; return function () {var innerargs = array.prototype.slice.call (аргументы); var finalargs = args.concat (innerargs); вернуть Self.Apply (контекст, FinalArgs); };};На этот раз метод bind () может связывать объекты, а также поддерживает передачу параметров во время связывания.
Продолжить, функции JavaScript также могут использоваться в качестве конструкторов. Когда связанные функции вызываются таким образом, ситуация более тонкая, и она должна участвовать в прохождении цепочки прототипа:
Function.prototype.bind = function (context) {var args = array.prototype.slice (аргументы, 1), f = function () {}, self = this, bound = function () {var innerargs = array.prototype.slice.call (аргументы); var finalargs = args.concat (innerargs); вернуть self.apply ((этот экземпляр f? This: context), finalargs); }; F.prototype = self.prototype; bound.prototype = new f (); return Bound;};Это реализация bind () в книге «Веб -приложение JavaScript»: установив конструктор реле F, связанная функция находится в той же цепочке прототипов, что и функция Calling Bind (). Используйте новый оператор, чтобы вызвать связанную функцию, и возвращаемый объект также может нормально использовать экземпляр. Следовательно, это самая строгая реализация bind ().
Чтобы поддержать функцию bind () в браузере, вам нужно лишь слегка изменить вышеуказанную функцию:
Function.prototype.bind = function (othis) {if (typeof this! == "function") {throw new TypeError ("function.prototype.bind - то, что пытается связать, не вызывает"); } var aargs = array.prototype.slice.call (аргументы, 1), ftobind = this, fnop = function () {}, fbound = function () {return ftobind.apply (этот экземпляр fnop && othis? }; fnop.prototype = this.prototype; fbound.prototype = new fnop (); вернуть fbound; };Приведенный выше краткий анализ использования и реализации метода Bind () в JavaScript - это все контент, которым я делюсь с вами. Я надеюсь, что это может дать вам ссылку, и я надеюсь, что вы сможете поддержать Wulin.com больше.