Как вызвать функцию внутри другой функции js
Перейти к содержимому

Как вызвать функцию внутри другой функции js

  • автор:

Функции

Зачастую нам надо повторять одно и то же действие во многих частях программы.

Например, необходимо красиво вывести сообщение при приветствии посетителя, при выходе посетителя с сайта, ещё где-нибудь.

Чтобы не повторять один и тот же код во многих местах, придуманы функции. Функции являются основными «строительными блоками» программы.

Примеры встроенных функций вы уже видели – это alert(message) , prompt(message, default) и confirm(question) . Но можно создавать и свои.

Объявление функции

Для создания функций мы можем использовать объявление функции.

Пример объявления функции:

function showMessage()

Вначале идёт ключевое слово function , после него имя функции, затем список параметров в круглых скобках через запятую (в вышеприведённом примере он пустой) и, наконец, код функции, также называемый «телом функции», внутри фигурных скобок.

function имя(параметры)

Наша новая функция может быть вызвана по своему имени: showMessage() .

function showMessage() < alert( 'Всем привет!' ); >showMessage(); showMessage();

Вызов showMessage() выполняет код функции. Здесь мы увидим сообщение дважды.

Этот пример явно демонстрирует одно из главных предназначений функций: избавление от дублирования кода.

Если понадобится поменять сообщение или способ его вывода – достаточно изменить его в одном месте: в функции, которая его выводит.

Локальные переменные

Переменные, объявленные внутри функции, видны только внутри этой функции.

function showMessage() < let message = "Привет, я JavaScript!"; // локальная переменная alert( message ); >showMessage(); // Привет, я JavaScript! alert( message ); // 

Внешние переменные

У функции есть доступ к внешним переменным, например:

let userName = 'Вася'; function showMessage() < let message = 'Привет, ' + userName; alert(message); >showMessage(); // Привет, Вася

Функция обладает полным доступом к внешним переменным и может изменять их значение.

let userName = 'Вася'; function showMessage() < userName = "Петя"; // (1) изменяем значение внешней переменной let message = 'Привет, ' + userName; alert(message); >alert( userName ); // Вася перед вызовом функции showMessage(); alert( userName ); // Петя, значение внешней переменной было изменено функцией

Внешняя переменная используется, только если внутри функции нет такой локальной.

Если одноимённая переменная объявляется внутри функции, тогда она перекрывает внешнюю. Например, в коде ниже функция использует локальную переменную userName . Внешняя будет проигнорирована:

let userName = 'Вася'; function showMessage() < let userName = "Петя"; // объявляем локальную переменную let message = 'Привет, ' + userName; // Петя alert(message); >// функция создаст и будет использовать свою собственную локальную переменную userName showMessage(); alert( userName ); // Вася, не изменилась, функция не трогала внешнюю переменную

Глобальные переменные

Переменные, объявленные снаружи всех функций, такие как внешняя переменная userName в вышеприведённом коде – называются глобальными.

Глобальные переменные видимы для любой функции (если только их не перекрывают одноимённые локальные переменные).

Желательно сводить использование глобальных переменных к минимуму. В современном коде обычно мало или совсем нет глобальных переменных. Хотя они иногда полезны для хранения важнейших «общепроектовых» данных.

Параметры

Мы можем передать внутрь функции любую информацию, используя параметры.

В нижеприведённом примере функции передаются два параметра: from и text .

function showMessage(from, text) < // параметры: from, text alert(from + ': ' + text); >showMessage('Аня', 'Привет!'); // Аня: Привет! (*) showMessage('Аня', "Как дела?"); // Аня: Как дела? (**)

Когда функция вызывается в строках (*) и (**) , переданные значения копируются в локальные переменные from и text . Затем они используются в теле функции.

Вот ещё один пример: у нас есть переменная from , и мы передаём её функции. Обратите внимание: функция изменяет значение from , но это изменение не видно снаружи. Функция всегда получает только копию значения:

function showMessage(from, text) < from = '*' + from + '*'; // немного украсим "from" alert( from + ': ' + text ); >let from = "Аня"; showMessage(from, "Привет"); // *Аня*: Привет // значение "from" осталось прежним, функция изменила значение локальной переменной alert( from ); // Аня

Значение, передаваемое в качестве параметра функции, также называется аргументом.

  • Параметр – это переменная, указанная в круглых скобках в объявлении функции.
  • Аргумент – это значение, которое передаётся функции при её вызове.

Мы объявляем функции со списком параметров, затем вызываем их, передавая аргументы.

Рассматривая приведённый выше пример, мы могли бы сказать: "функция showMessage объявляется с двумя параметрами, затем вызывается с двумя аргументами: from и "Привет" ".

Значения по умолчанию

Если при вызове функции аргумент не был указан, то его значением становится undefined .

Например, вышеупомянутая функция showMessage(from, text) может быть вызвана с одним аргументом:

showMessage("Аня");

Это не приведёт к ошибке. Такой вызов выведет "*Аня*: undefined" . В вызове не указан параметр text , поэтому предполагается, что text === undefined .

Если мы хотим задать параметру text значение по умолчанию, мы должны указать его после = :

function showMessage(from, text = "текст не добавлен") < alert( from + ": " + text ); >showMessage("Аня"); // Аня: текст не добавлен

Теперь, если параметр text не указан, его значением будет "текст не добавлен"

В данном случае "текст не добавлен" это строка, но на её месте могло бы быть и более сложное выражение, которое бы вычислялось и присваивалось при отсутствии параметра. Например:

function showMessage(from, text = anotherFunction()) < // anotherFunction() выполнится только если не передан text // результатом будет значение text >

Вычисление параметров по умолчанию

В JavaScript параметры по умолчанию вычисляются каждый раз, когда функция вызывается без соответствующего параметра.

В приведённом выше примере, функция anotherFunction() не будет вызвана вообще, если указан параметр text .

С другой стороны, функция будет независимо вызываться каждый раз, когда text отсутствует.

Использование параметров по умолчанию в ранних версиях JavaScript

Ранние версии JavaScript не поддерживали параметры по умолчанию. Поэтому существуют альтернативные способы, которые могут встречаться в старых скриптах.

Например, явная проверка на undefined :

function showMessage(from, text) < if (text === undefined) < text = 'текст не добавлен'; >alert( from + ": " + text ); >

…Или с помощью оператора || :

function showMessage(from, text) < // Если значение text ложно, тогда присвоить параметру text значение по умолчанию // заметим, что при этом пустая строка text === "" будет также считаться отсутствующим значением text = text || 'текст не добавлен'; . >

Альтернативные параметры по умолчанию

Иногда имеет смысл присваивать значения по умолчанию для параметров не в объявлении функции, а на более позднем этапе.

Во время выполнения функции мы можем проверить, передан ли параметр, сравнив его с undefined :

function showMessage(text) < // . if (text === undefined) < // если параметр отсутствует text = 'пустое сообщение'; >alert(text); > showMessage(); // пустое сообщение

…Или мы можем использовать оператор || :

function showMessage(text) < // если значение text ложно или равняется undefined, тогда присвоить text значение 'пусто' text = text || 'пусто'; . >

Современные движки JavaScript поддерживают оператор нулевого слияния ?? . Его использование будет лучшей практикой, в случае, если большинство ложных значений, таких как 0 , следует расценивать как «нормальные».

function showCount(count) < // если count равен undefined или null, показать "неизвестно" alert(count ?? "неизвестно"); >showCount(0); // 0 showCount(null); // неизвестно showCount(); // неизвестно

Возврат значения

Функция может вернуть результат, который будет передан в вызвавший её код.

Простейшим примером может служить функция сложения двух чисел:

function sum(a, b) < return a + b; >let result = sum(1, 2); alert( result ); // 3

Директива return может находиться в любом месте тела функции. Как только выполнение доходит до этого места, функция останавливается, и значение возвращается в вызвавший её код (присваивается переменной result выше).

Вызовов return может быть несколько, например:

function checkAge(age) < if (age >= 18) < return true; >else < return confirm('А родители разрешили?'); >> let age = prompt('Сколько вам лет?', 18); if ( checkAge(age) ) < alert( 'Доступ получен' ); >else

Возможно использовать return и без значения. Это приведёт к немедленному выходу из функции.

function showMovie(age) < if ( !checkAge(age) ) < return; >alert( "Вам показывается кино" ); // (*) // . >

В коде выше, если checkAge(age) вернёт false , showMovie не выполнит alert .

Результат функции с пустым return или без него – undefined

Если функция не возвращает значения, это всё равно, как если бы она возвращала undefined :

function doNothing() < /* пусто */ >alert( doNothing() === undefined ); // true

Пустой return аналогичен return undefined :

function doNothing() < return; >alert( doNothing() === undefined ); // true

Никогда не добавляйте перевод строки между return и его значением

Для длинного выражения в return может быть заманчиво разместить его на нескольких отдельных строках, например так:

return (some + long + expression + or + whatever * f(a) + f(b))

Код не выполнится, потому что интерпретатор JavaScript подставит точку с запятой после return . Для него это будет выглядеть так:

return; (some + long + expression + or + whatever * f(a) + f(b))

Таким образом, это фактически стало пустым return .

Если мы хотим, чтобы возвращаемое выражение занимало несколько строк, нужно начать его на той же строке, что и return . Или, хотя бы, поставить там открывающую скобку, вот так:

return ( some + long + expression + or + whatever * f(a) + f(b) )

И тогда всё сработает, как задумано.

Выбор имени функции

Функция – это действие. Поэтому имя функции обычно является глаголом. Оно должно быть кратким, точным и описывать действие функции, чтобы программист, который будет читать код, получил верное представление о том, что делает функция.

Как правило, используются глагольные префиксы, обозначающие общий характер действия, после которых следует уточнение. Обычно в командах разработчиков действуют соглашения, касающиеся значений этих префиксов.

Например, функции, начинающиеся с "show" обычно что-то показывают.

Функции, начинающиеся с…

  • "get…" – возвращают значение,
  • "calc…" – что-то вычисляют,
  • "create…" – что-то создают,
  • "check…" – что-то проверяют и возвращают логическое значение, и т.д.

Примеры таких имён:

showMessage(..) // показывает сообщение getAge(..) // возвращает возраст (получая его каким-то образом) calcSum(..) // вычисляет сумму и возвращает результат createForm(..) // создаёт форму (и обычно возвращает её) checkPermission(..) // проверяет доступ, возвращая true/false

Благодаря префиксам, при первом взгляде на имя функции становится понятным, что делает её код, и какое значение она может возвращать.

Одна функция – одно действие

Функция должна делать только то, что явно подразумевается её названием. И это должно быть одним действием.

Два независимых действия обычно подразумевают две функции, даже если предполагается, что они будут вызываться вместе (в этом случае мы можем создать третью функцию, которая будет их вызывать).

Несколько примеров, которые нарушают это правило:

  • getAge – будет плохим выбором, если функция будет выводить alert с возрастом (должна только возвращать его).
  • createForm – будет плохим выбором, если функция будет изменять документ, добавляя форму в него (должна только создавать форму и возвращать её).
  • checkPermission – будет плохим выбором, если функция будет отображать сообщение с текстом доступ разрешён/запрещён (должна только выполнять проверку и возвращать её результат).

В этих примерах использовались общепринятые смыслы префиксов. Конечно, вы в команде можете договориться о других значениях, но обычно они мало отличаются от общепринятых. В любом случае вы и ваша команда должны чётко понимать, что значит префикс, что функция с ним может делать, а чего не может.

Сверхкороткие имена функций

Имена функций, которые используются очень часто, иногда делают сверхкороткими.

Например, фреймворк jQuery определяет функцию с помощью $ . В библиотеке Lodash основная функция представлена именем _ .

Это исключения. В основном имена функций должны быть в меру краткими и описательными.

Функции == Комментарии

Функции должны быть короткими и делать только что-то одно. Если это что-то большое, имеет смысл разбить функцию на несколько меньших. Иногда следовать этому правилу непросто, но это определённо хорошее правило.

Небольшие функции не только облегчают тестирование и отладку – само существование таких функций выполняет роль хороших комментариев!

Например, сравним ниже две функции showPrimes(n) . Каждая из них выводит простое число до n .

Первый вариант использует метку nextPrime :

function showPrimes(n) < nextPrime: for (let i = 2; i < n; i++) < for (let j = 2; j < i; j++) < if (i % j == 0) continue nextPrime; >alert( i ); // простое > >

Второй вариант использует дополнительную функцию isPrime(n) для проверки на простое:

function showPrimes(n) < for (let i = 2; i < n; i++) < if (!isPrime(i)) continue; alert(i); // простое >> function isPrime(n) < for (let i = 2; i < n; i++) < if ( n % i == 0) return false; >return true; >

Второй вариант легче для понимания, не правда ли? Вместо куска кода мы видим название действия ( isPrime ). Иногда разработчики называют такой код самодокументируемым.

Таким образом, допустимо создавать функции, даже если мы не планируем повторно использовать их. Такие функции структурируют код и делают его более понятным.

Итого

Объявление функции имеет вид:

function имя(параметры, через, запятую) < /* тело, код функции */ >
  • Передаваемые значения копируются в параметры функции и становятся локальными переменными.
  • Функции имеют доступ к внешним переменным. Но это работает только изнутри наружу. Код вне функции не имеет доступа к её локальным переменным.
  • Функция может возвращать значение. Если этого не происходит, тогда результат равен undefined .

Для того, чтобы сделать код более чистым и понятным, рекомендуется использовать локальные переменные и параметры функций, не пользоваться внешними переменными.

Функция, которая получает параметры, работает с ними и затем возвращает результат, гораздо понятнее функции, вызываемой без параметров, но изменяющей внешние переменные, что чревато побочными эффектами.

  • Имя функции должно понятно и чётко отражать, что она делает. Увидев её вызов в коде, вы должны тут же понимать, что она делает, и что возвращает.
  • Функция – это действие, поэтому её имя обычно является глаголом.
  • Есть много общепринятых префиксов, таких как: create… , show… , get… , check… и т.д. Пользуйтесь ими как подсказками, поясняющими, что делает функция.

Функции являются основными строительными блоками скриптов. Мы рассмотрели лишь основы функций в JavaScript, но уже сейчас можем создавать и использовать их. Это только начало пути. Мы будем неоднократно возвращаться к функциям и изучать их всё более и более глубоко.

Задачи

Обязателен ли "else"?

важность: 4

Следующая функция возвращает true , если параметр age больше 18 .

В ином случае она запрашивает подтверждение через confirm и возвращает его результат:

function checkAge(age) < if (age >18) < return true; >else < // . return confirm('Родители разрешили?'); >>

Будет ли эта функция работать как-то иначе, если убрать else ?

function checkAge(age) < if (age >18) < return true; >// . return confirm('Родители разрешили?'); >

Есть ли хоть одно отличие в поведении этого варианта?

Оба варианта функций работают одинаково, отличий нет.

Перепишите функцию, используя оператор '?' или '||'

важность: 4

Следующая функция возвращает true , если параметр age больше 18 .

В ином случае она задаёт вопрос confirm и возвращает его результат.

function checkAge(age) < if (age >18) < return true; >else < return confirm('Родители разрешили?'); >>

Перепишите функцию, чтобы она делала то же самое, но без if , в одну строку.

Сделайте два варианта функции checkAge :

  1. Используя оператор ?
  2. Используя оператор ||
function checkAge(age) < return (age >18) ? true : confirm('Родители разрешили?'); >

Используя оператор || (самый короткий вариант):

function checkAge(age) < return (age >18) || confirm('Родители разрешили?'); >

Обратите внимание, что круглые скобки вокруг age > 18 не обязательны. Они здесь для лучшей читаемости кода.

Возврат функций из функций — JS: Функциональное программирование

По своему опыту могу сказать, что возврат функций из функций вызывает наибольшие сложности у новичков. И дело даже не в том, что возврат сложен сам по себе, а в том, что поначалу очень сложно понять, зачем это может понадобиться. В реальной жизни эта техника используется часто, причем как в JavaScript, так и во многих других языках. Функции, принимающие на вход функции, которые возвращают функции — обычное дело для любого кода на JavaScript.

Для закрепления материала пройдитесь по нему два раза. Первый раз просто бегло прочитайте, второй раз изучите внимательно, проверяя каждую строчку кода на сервисе repl.it .

Начнем погружение с уже пройденного материала:

const identity = (v) => v; identity('wow'); // wow const sum = identity((a, b) => a + b); sum(1, 8); // 9 

Функции — это такие же данные, как числа или строки, поэтому функции можно передавать в другие функции в виде аргументов, а также возвращать из функций. Мы даже можем определить функцию внутри другой функции и вернуть ее наружу. И в этом нет ничего удивительного. Константы можно создавать где угодно.

const generateSumFinder = () =>  const sum = (a, b) => a + b; // создали функцию return sum; // и вернули ее >; const sum = generateSumFinder(); // sum теперь — функция, которую вернула функция generateSumFinder sum(1, 5); // 6 // sum складывает числа 

Можно даже обойтись без промежуточного создания константы:

// вызвали функцию, которая возвращает функцию, // и тут же вызвали возвращенную функцию generateSumFinder()(1, 5); // 6 // ((a, b) => a + b)(1, 5) 

Всегда, когда видите подобные вызовы f()()() , знайте: функции возвращаются!

Теперь посмотрим, как еще можно описать функцию generateSumFinder :

// предыдущий вариант для сравнения // const generateSumFinder = () => // const sum = (a, b) => a + b; // return sum; // >; // новый вариант const generateSumFinder = () => (a, b) => a + b; 

Для понятности можно расставить скобки:

const generateSumFinder = () => ((a, b) => a + b); 

Определение функции обладает правой ассоциативностью. Все, что находится справа от => , считается телом функции. Количество вложений никак не ограничено. Вполне можно встретить и такие варианты:

const sum = (x) => (y) => (z) => x + y + z; // расставим скобки для того чтобы увидеть как функции вложены друг в друга // const sum = x => (y => (z => x + y + z)); sum(1)(3)(5); // 9 

Ту же функцию можно представить другим способом, вынеся каждую функцию в свою собственную константу. Этот способ полезен как мысленный эксперимент, чтобы понять, где заканчивается одна и начинается другая функция. Но сама по себе она не заработает, потому что теряется замыкание.

const inner1 = (z) => x + y + z; const inner2 = (y) => inner1; const sum = (x) => inner2; 

Попробуем последовательно пройтись по вызовам функции выше, чтобы понять, как получается результат. После каждого вызова (кроме последнего) возвращается новая функция, в которую подставлено значение из внешней функции за счет замыкания.

sum(1)(3)(5); // 9 const sum1 = (x) => (y) => (z) => x + y + z; // sum(1); const sum2 = (y) => (z) => 1 + y + z; // inner2 // sum(1)(3) const sum3 = (z) => 1 + 3 + z; // inner1 // sum(1)(3)(5) const sum4 = 1 + 3 + 5; // 9 

Как видно выше, sum1 , sum2 и sum3 — это функции, а sum4 уже число, так как были вызваны все внутренние функции.

Давайте распишем все функции:

const sum = (x) => (y) => (z) => x + y + z; // const sum = x => (y => (z => x + y + z)); 
  • Функция sum принимает x и возвращает функцию, которая
    • принимает y и возвращает функцию, которая
      • принимает z и возвращает сумму x + y + z

      Попробуем развить идею функции callTwice из предыдущего урока. Напишем функцию generate , которая не применяет функцию сразу, а генерирует новую.

      const generate = (f) => (arg) => f(f(arg)); // const generate = f => (arg => f(f(arg))); 

      Функция generate принимает функцию в качестве аргумента и возвращает новую функцию. Внутри новой функции переданная изначально функция вызывается два раза:

      Создадим функцию f1 . Она будет той функцией, которую вернет generate если передать ей функцию Math.sqrt (она вычисляет квадратный корень числа).

      Получается, f1 — это функция, которая принимает число и возвращает корень корня — Math.sqrt(Math.sqrt(x)) :

      const f1 = generate(Math.sqrt); f1(16); // 2 // generate(Math.sqrt)(16); 

      Еще пример: передадим в функцию generate новую функцию на ходу, без предварительного создания. Переданная функция возводит число в квадрат.

      const f2 = generate(x => x ** 2); f2(4); // 256 // generate(x => x ** 2)(4); 

      Теперь функция f2 возводит число в квадрат два раза: (4 2 ) 2 .

      Функция generate имеет такое имя не просто так. Дело в том, что возврат функции порождает каждый раз новую функцию при каждом вызове, даже если тела этих функций совпадают:

      const f1 = generate(x => x ** 2); const f2 = generate(x => x ** 2); console.log(f1 === f2); // => false 

      Поэтому про любую функцию, которая возвращает функцию можно сказать что она генерирует функцию. Запомнить довольно просто, если вы где-то слышите или читаете что происходит генерация функций, значит кто-то их возвращает.

      Замыкание

      Работа практически всех описанных примеров базировалась на одном интересном свойстве, которое называется «замыкание». О нем говорилось в предыдущем курсе, но пришло время освежить память.

      const generateDouble = (f) => (arg) => f(f(arg)); const f1 = generateDouble(Math.sqrt); 

      Когда generateDouble закончила работу и вернула новую функцию, экземпляр функции generateDouble исчез, уничтожился вместе с используемыми внутри аргументами.

      Но та функция, которую вернула generateDouble , все еще использует аргумент. В обычных условиях он бы навсегда исчез, но тут он «запомнился» или «замкнулся» внутри возвращенной функции. Технически внутренняя функция, как и любая другая в JavaScript, связана со своим лексическим окружением, которое не пропадает, даже если функция покидает это окружение.

      Функция, которая была возвращена из generateDouble , называется замыканием. Замыкание — это функция, «запомнившая» часть окружения, где она была задана. Функция замыкает в себе идентификаторы (все, что мы определяем) из лексической области видимости.

      В СИКП дается прекрасный пример на понимание замыканий. Представьте себе, что мы проектируем систему, в которой нужно запомнить пароль пользователя, а потом проверять его, когда пользователь будет заново заходить. Можно смоделировать функцию savePassword , которая принимает на вход пароль и возвращает предикат, то есть функцию, возвращающую true или false, для его проверки. Посмотрите, как это выглядит:

      const secret = 'qwerty'; // Возвращается предикат. const isCorrectPassword = savePassword(secret); // Теперь можно проверять console.log(isCorrectPassword('wrong password')); // => false console.log(isCorrectPassword('qwerty')); // => true 

      А вот как выглядит код функции savePassword :

      const savePassword = password => passwordForCheck => password === passwordForCheck; 

      Возврат функций в реальном мире (Debug)

      Логгирование — неотъемлемая часть разработки. Для понимания того, что происходит внутри кода, используют специальные библиотеки, с помощью которых можно логгировать (выводить) информацию о проходящих внутри процессах, например в файл. Типичный лог веб-сервера, обрабатывающего HTTP-запросы выглядит так:

      В JavaScript самой популярной библиотекой для логгирования считается Debug . Вот как выглядит ее вывод:

      Обратите внимание на левую часть каждой строки. Debug для каждой выводимой строчки использует так называемый неймспейс, некоторую строчку, которая указывает принадлежность выводимой строчки к определенной подсистеме или части кода. Он используется для фильтрации, когда логов становится много. Другими словами, можно указать "выводи сообщения только для http". А вот как это работает:

      import debug from 'debug'; const logHttp = debug('http'); const logHandler = debug('handler'); logHttp('hello!'); logHttp('i am from http'); logHandler('hello from handler!'); logHandler('i am from handler'); 

      Что приведет к такому выводу:

      Открыть доступ

      Курсы программирования для новичков и опытных разработчиков. Начните обучение бесплатно

      • 130 курсов, 2000+ часов теории
      • 1000 практических заданий в браузере
      • 360 000 студентов

      Наши выпускники работают в компаниях:

      Вызов функций JavaScript

      Код внутри функции JavaScript не выполняется, когда эта функция определяется. Он выполняться только тогда, когда эта функция будет "запущена".

      Обычно говорят "вызвать функцию" или "выполнить функцию".

      Запуск функции как функции

       function myFunction(a, b) < return a * b; >myFunction(10, 2); // вернет 20 

      Функция в предыдущем примере не принадлежит какому-либо объекту. Однако в JavaScript всегда существует "дефолтный" глобальный объект.

      В HTML таким глобальным объектом является HTML страница, таким образом, функция из предыдущего примера "принадлежит" текущей HTML странице.

      В браузере объект страницы — это окно браузера или объект window. Так, функция из примера автоматически становится функцией объекта window. Таким образом, myFunction() и window.myFunction() это одна и та же функция:

       function myFunction(a, b) < return a * b; >window.myFunction(10, 2); // также вернет 20 

      Это обычный способ вызывать функции JavaScript. Однако, это не очень хорошая практика. Глобальные переменные, методы или функции могут создавать конфликты имен и приводить к сбоям в глобальном объекте.

      Ключевое слово this

      В JavaScript ключевое слово this — это объект, который "владеет" текущим кодом.

      При использовании в функции значением ключевого слова this является объект, который "владеет" данной функцией.

      Обратите внимание, что this — это не переменная, а ключевое слово. Вы не можете изменять его значение.

      Глобальный объект

      Когда функция вызывается без объекта-владельца, значением ключевого слова this становится глобальный объект.

      В браузере глобальный объект — это окно браузера (объект window).

      В следующем примере функция возвращает объект window:

       var x = myFunction(); // значением x будет объект window function myFunction()

      Внимание! Вызов функции как глобальной, устанавливает this на глобальный объект. Использование объекта window в качестве переменной может привести к краху вашей программы.

      Вызов функции как метода

      В JavaScript вы можете определять функции как методы объектов.

      В следующем примере создается объект (myObject) с двумя свойствами (firstName и lastName) и одним методом (fullName):

       var myObject = < firstName:"John", lastName: "Doe", fullName: function () < return this.firstName + " " + this.lastName; >> myObject.fullName(); // вернет "John Doe" 

      Метод fullName — функция. Эта функция принадлежит объекту. Объект myObject — владелец функции fullName.

      Ключевое слово this указывает на объект, который "владеет" данным кодом JavaScript. В данном случае значением ключевого слова this является объект myObject:

       var myObject = < firstName:"John", lastName: "Doe", fullName: function () < return this; >> myObject.fullName(); // вернет [object Object] (объект-владелец) 

      Вызов функции как метод объекта устанавливает в качестве значения ключевого слова this сам объект.

      Вызов функции как конструктора объекта

      Если перед вызовом функции стоит ключевое слово new, то это вызывается конструктор объекта.

      Выглядит так, будто вы создаете новую функцию, но так как функции в JavaScript являются объектами, вы на самом деле создаете новый объект:

       // Это функция конструктор: function myFunction(arg1, arg2) < this.firstName = arg1; this.lastName = arg2; >// Это создает новый объект var x = new myFunction("John", "Doe"); x.firstName; // вернет "John" 

      Вызов конструктора создает новый объект. Новый объект наследует свойства и методы своего конструктора.

      У ключевого слова this в конструкторе нет значения. Значением ключевого слова this станет новый объект, созданный при вызове функции конструктора.

      Вызвать функцию из функции JavaScript

      Я только начал изучать JavaScript. Надо вызвать функцию, из функции пытаюсь не получается. Помогите пожалуйста. Код:

       self.AutoSearch = function (searchPanelUpdateRequired, isMobileOverride, function ());>) < var windowWidth = document.documentElement.clientWidth; if ((windowWidth >500) || (isMobileOverride == true)) < if (self.SearchData.Configuration.SearchAutoUpdate()) < self.DoSearch(1, searchPanelUpdateRequired, false); >else < if (searchPanelUpdateRequired != false) < self.UpdateSearchPanel(); >> > return true; > 

      Отслеживать

      9,333 3 3 золотых знака 29 29 серебряных знаков 57 57 бронзовых знаков

      задан 29 янв 2018 в 10:25

      Исмоил Мухаммадиев Исмоил Мухаммадиев

      327 2 2 золотых знака 6 6 серебряных знаков 19 19 бронзовых знаков

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *