Роль шаблона проектирования JavaScript заключается в улучшении повторного использования и читаемости кода, что облегчает поддержание и расширение кода.
В JavaScript функция - это класс объектов, что означает, что ее можно передавать как параметр для других функций; Кроме того, функция также может обеспечить масштаб.
Синтаксис для создания функции
Названные функции выражения
// Имя Функции выражение var add = function add (a, b) {return a+b;}; var foo = function bar () {console.log (foo === bar);}; foo (); // trueМожно видеть, что они ссылаются на ту же функцию, но это действительно только в корпусе функции.
var foo = function bar () {}; console.log (foo === bar); // referenceerr: bar не определенТем не менее, вы не можете вызвать функцию, вызывая Bar ().
var foo = (function bar () {console.log (foo === bar);}) (); // falseФункциональные выражения
// также известный как анонимная функция var add = function (a, b) {return a+b;};Значение, назначенное переменной, является само определение функции. Таким образом, добавление становится функцией, которую можно назвать в любом месте.
Объявление функций
function foo () {// код здесь} // Здесь нет необходимости в полуколонахПри трейлинге полуколоны выражения функций всегда должны использовать полуколоны, а окончание полуколонов не требуется в объявлении функции.
Разница между декларативной функцией и выражением функции состоит в том, что в течение периода предварительного спуска JS функция декларативной функции будет извлечена сначала, а затем код JS будет выполнен в порядке:
console.log (f1); // [Функция: F1]
console.log (f2); // undefined, JavaScript не полностью интерпретируется и выполняется по порядку, но будет «предварительно компилировать» JavaScript перед интерпретацией. Во время процесса предварительного спуска окончательная функция будет выполнена в первую очередь.
Функция f1 () {console.log ("i am f1");} var f2 = function () {console.log ("i am f2");};Поскольку объявление функций будет выполнено во время глобальной конструкции областей, объявление функций представляют собой свойства объектов окон, что показывает, почему независимо от того, где мы объявляем функции, объявляя функции в конечном итоге принадлежат к окнам объектам.
На языке JavaScript любая анонимная функция принадлежит окно -объекту. При определении анонимной функции она вернет адрес своей памяти. Если переменная получает этот адрес памяти в настоящее время, анонимная функция может использоваться в программе, поскольку анонимная функция также определяется и назначена во время глобальной конструкции среды выполнения, так что это указание анонимной функции также является оконным объектом
var f2 = function () {console.log ("i am f2");}; console.log (f2 ()); // i am f2 (function () {console.log (this === window); // true}) ();Функциональные объявления и выражения
Продвижение функции (подъем)
Поведение объявления функции не эквивалентно именованному выражению функции. Разница - это поведение поднятия. См. Следующий пример:
<script type = "text/javascript"> // Функция глобальной функции foo () {alert ("global foo!");} function bar () {alert ('global bar');} function hoist () {console.log (typeof foo); // function console.log (typeof bar); // undefied foo (); bar (); // typeError: 'не определено' не является функцией // переменная foo и реализатор Prop -Function foo () {alert ('Local foo! '); } // Продвигается только стержневой панели, часть реализации функции не способствует var bar = function () {alert ('local bar!'); }; } hoist (); </script>Для всех переменных, где бы они ни были объявлены в теле, они внутренне продвигаются на вершину функции. Причина общего применения функций заключается в том, что функции представляют собой только объекты, назначенные переменным.
Как следует из названия, улучшение означает упоминание следующих вещей на вершину. В JS он должен обновить вещи, определенные в следующем (переменные или функции) до предыдущего определения. Как видно из приведенного выше примера, Foo и Bar в функциональном подъеме внутри функции перемещаются на вершину, охватывая, таким образом, глобальные функции Foo и Bar. Разница между локальной функцией и Foo заключается в том, что FOO продвигается на вершине и может работать нормально, в то время как определение BAR () не было улучшено, только ее объявление продвигается. Следовательно, когда bar () выполняется, результат не определен, а не используется в качестве функции.
Режим функции в реальном времени
Функции также являются объектами, поэтому их можно использовать в качестве возвращаемых значений. Преимущество использования функций самообучения состоит в том, чтобы напрямую объявить анонимную функцию и немедленно использовать ее, чтобы избежать определения функции, которая не используется один раз, и ее избегают из-за проблемы конфликтов именования. В JS нет концепции пространства имен, поэтому легко иметь конфликты с именем функции. После того, как конфликт на именовании будет создан, последний объявил, что один должен преобладать.
Режим 1:
<script> (function () {var a = 1; return function () {alert (2);};} () ()); // 2 появляется, первые скобки выполняются, а вторые скобки выполняют внутренние анонимные функции </script>Паттерн 2: Указывание переменных функции самостоятельного выполнения
<script type = "text/javascript"> var result = (function () {return 2;}) (); // функция Alert (result); // Результат указывает на возвращаемое значение 2 самостоятельной функции; Если result () появляется, возникнет ошибка </script>Образец третий: вложенные функции
<script type = "text/javascript"> var result = (function () {return function () {return 2;};}) (); alert (result ()); // Когда Alert (result) function () {return 2} </script>Режим 4: Функция самовосставления присваивает его возвращаемое значение переменной
var abc = (function () {var a = 1; return function () {return ++ a;}}) (); // Функция функции самостоятельного выполнения возвращает функцию после возврата к переменной оповещению (abc ()); // Если она предупреждает (ABC), код после возврата будет выскочен; Если это ABC (), функция после возврата будет выполненаШаблон 5: функция выполняется внутри, рекурсивно
// Это функция самостоятельного выполнения, функция выполняется внутренне, рекурсивная функция abc () {abc (); }Режим обратного вызова
Функция обратного вызова: Когда вы передаете функцию write () в качестве аргумента в другой функцию call (), то Call () может выполнить (или call) write () в какой -то момент. В этом случае write () называется функцией обратного вызова.
Асинхронное слушатель событий
Режим обратного вызова имеет много применений, например, когда слушатель событий прикреплен к элементу на странице, он фактически дает указатель на функцию обратного вызова, которая будет вызвана при возникновении события. нравиться:
document.addeventlistener ("click", console.log, false);
Приведенный выше пример кода показывает консоль функции обратного вызова. Log () в режиме пузырьков, когда нажимает документ.
JavaScript особенно подходит для программирования, управляемого событиями, потому что режим обратного вызова поддерживает программы для работы асинхронно.
время
Другим примером использования режима обратного вызова является использование метода тайм -аута, предоставленного объектом Window Brower's Owind: setTimeout () и setInterval (), например:
<script type = "text/javascript"> var call = function () {console.log ("100 мс будет спросить ..."); }; setTimeout (вызов, 100); </script>Режим обратного вызова в библиотеке
При разработке библиотеки JS функция обратного вызова пригодится. Код библиотеки должен как можно больше использовать многоразовый код, и обратный вызов может помочь достичь этого обобщения. Когда мы разрабатываем огромную библиотеку JS, факт заключается в том, что пользователям не нужна большая часть ее, мы можем сосредоточиться на основных функциях и предоставлять функции обратного вызова в «форме крюка», что облегчит нам создание, масштабирование и настраивание библиотечных методов
Каррики
Карринг - это метод, который преобразует функцию в новую упрощенную (в меньшее количество параметров) функцию, заполняя несколько параметров в корпус функции. ― 【Опытный в JavaScript】
Проще говоря, карризация - это процесс преобразования, то есть процесс преобразования нашей функции. Как показано в следующем примере:
<script type = "text/javascript"> // основанная на карри функция add () функция add (x, y) {var oldx = x, oldy = y; if (typeof oldy == "undefined") {return function (newy) {return oldx + newy; }; } // полностью применить возврат x+y; } // тест typeof add (5); // выход "функция" add (3) (4); // 7 // Создать и сохранить новую функцию var add2000 = add (2000); add2000 (10); // Выход 2010 </script>Когда add () вызывает впервые, он создает закрытие для возвращенной внутренней функции. Это закрытие хранит исходные значения x и y в частных переменных Oldx и Oldy.
Теперь мы сможем использовать общий метод карри, используя любую функцию, например:
<script type = "text/javascript"> // Обычная функция функции add (x, y) {return x + y; } // curry функция для получения новой функции var newAdd = test (add, 5); Newadd (4); // 9 // Другой вариант, напрямую вызовите новый тест функции (Add, 6) (7); // Выход 13 </script>Когда использовать карри
Когда обнаруживается, что одна и та же функция вызывается, и большая часть пропущенных параметров одинакова, тогда функция может быть хорошим кандидатом на причал