ݺߣ

ݺߣShare a Scribd company logo
Введение в JavaScript
функции
Функция JavaScript представляет собой блок кода, предназначенный для
выполнения конкретной задачи.
Функция JavaScript выполняется, когда "что-то" вызывает его (называет).
Внутри функции, аргументы используются в качестве локальных переменных.
functionName(parameter1, parameter2, parameter3) {
code to be executed
}
JavaScript Functions
function myFunction(p1, p2)
{
return p1 * p2;
}
var x = myFunction(5, 10);
console.log(x);
Functions
Вызов:
● При возникновении события (когда пользователь нажимает кнопку)
● Когда он вызывается (называется) из кода JavaScript
● Автоматически (сам вызывается)
Возврат значения:
Когда JavaScript достигает оператора возврата, то функция прекратит выполнение.
Возвращаемое значение "возвращается" обратно в "вызывающей".
Functions
Цели Function
Reuse
Information
hiding
цели
Composition
Цели Function
Определение Function
Функции JavaScript определяются с помощью ключевого слова function.
Вы можете использовать объявление function или expression function.
Выражение функции может быть сохранено в переменной:
var x = function (a, b) {return a * b};
После того, как выражение функция сохранена в переменной, переменная может быть
использована в качестве функции:
var z = x(4, 3);
Функция выше фактически является анонимной функцией (функция без имени).
Определение Function
Конструктор Function():
var myFunction = new Function("a", "b", "return a * b");
// тоже самое что и
var myFunction = function (a, b) {return a * b};
Определение Function
Конструктор Function(): Анти-паттерн
Определение Function
Demo:
// v 1.1
function foo (a, b) {
return a * b;
}
var z = foo (4, 3);
console.log(z);
Определение Function
Demo :
// v 1.1
function foo (a, b) {
return a * b
}
var z = foo (4, 3);
console.log(z);
// v 1.2
var z = foo (4, 3);
function foo (a, b) {
return a * b;
}
console.log(z);
Определение Function
Способы:
// v 1.1
function foo (a, b) {
return a * b
}
var z = foo (4, 3);
console.log(z);
// v 1.2
var z = foo (4, 3);
function foo (a, b) {
return a * b
}
console.log(z);
// v 1.3
var x = function (a, b) {return a * b};
var z = x(4, 3);
Определение Function
Demo :
// v 1.1
function foo (a, b) {
return a * b
}
var z = foo (4, 3);
console.log(z);
// v 1.2
var z = foo (4, 3);
function foo (a, b) {
return a * b
}
console.log(z);
// v 1.3
var x = function (a, b) {return a * b};
var z = x(4, 3);
// v 1.4
var z = x(4, 3);
var x = function (a, b) {return a * b};
Определение Function
Demo :
// v 1.1
function foo (a, b) {
return a * b
}
var z = foo (4, 3);
console.log(z);
// v 1.2
var z = foo (4, 3);
function foo (a, b) {
return a * b
}
console.log(z);
// v 1.3
var x = function (a, b) {return a * b};
var z = x(4, 3);
// v 1.4
var z = x(4, 3);
var x = function (a, b) {return a * b};
Чтооооо?
Hoisting
Hoisting - это поведение перемещения объявленных переменных к началу текущей области
в JavaScript (по умолчанию).
x = 5; // Assign 5 to x
elem = document.getElementById("demo");
elem.innerHTML = x;
var x; // Declare x
JavaScript поднимает только объявление, но не инициализацию
var x = 5; // Initialize x
elem = document.getElementById("demo");
elem.innerHTML = x + " " + y;
var y = 7; // Initialize y
Чтобы избежать ошибок, всегда объявляйте все переменные в начале каждого scope!!!!!!
Hoisting
Само вызывающиеся
Function
Вы должны добавить круглые скобки вокруг функции, чтобы указать, что это выражение
функция:
(function () {
console.log("Hello!!"); // А вызову-ка сама себя
})();
Для чего:
- Предварительное вычисление
- Создание scope
Параметры Function
Параметры функции являются имена, перечисленные в определении функции.
Аргументы функции реальные значения, переданные (и полученные) функции.
functionName(parameter1, parameter2, parameter3) {
code to be executed
}
Параметры:
● Функций JavaScript типы данных для параметров не указываются.
● Функции JavaScript не выполняют проверку типов на переданных аргументов.
● Функции JavaScript не проверяют количество аргументов, полученных.
Параметры Function
Если функция вызывается с отсутствующими аргументами (меньше, чем объявлена),
отсутствующие значения устанавливаются :
undefined
Присвоение значения по умолчанию для параметра :
function myFunction(x, y) {
y = y || 0;
console.log(x, y)
}
Если функция вызывается слишком большим количеством аргументов (больше, чем
декларируется), эти аргументы не могут быть переданы, потому что они не имеют названия.
Они могут быть достигнуты только в объекте аргументов
Arguments Object
Объект аргумент содержит массив аргументов, используемых при вызове функции
(x = sumAll(1, 123, 500, 115, 44, 88);
function sumAll() {
var i, sum = 0;
for (i = 0; i < arguments.length; i++) {
sum += arguments[i];
}
return sum;
}
Аргументы в действительности не является массивом. Это массиво-подобный объект.
Аргумент-объект имеет свойство длины, но у него не хватает всех методов массивов.
Вызов Function
Вызов функции приостанавливает выполнение текущей функции, передавая управление и
параметры новой функции. В дополнение к заявленным параметрам, каждая функция
получает два дополнительных параметра: this and arguments.
В JavaScript this, является объектом, который "владеет" текущим кодом.
Когда функция вызывается без объекта владельца, значение this становится глобальным
объектом.
Вызов Function как метода
Когда функция сохраняется как свойство объекта, мы называем это метод.
Связывания этого на объект происходит во время вызова.
var myObject = {
firstName:"Bilbo",
lastName: "Baggins",
fullName: function () {
return this.firstName + " " + this.lastName;
},
getContex: function () {
return this;
}
}
myObject.fullName();
myObject.getContex();
Вызов Function как Function
Функция не принадлежит ни одному объекту. В браузере объект страницы в окне браузера.
Функция автоматически становится функцией window .
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); // myFunction(10, 2) will return 20
window.myFunction(10, 2); // window.myFunction(10, 2) will also return
20
function myFunction() {
return this;
}
myFunction(); // Will return the window object
Вызов Function как Function
!!! Метод не может использовать внутреннюю функцию, чтобы помочь ему работать со
свойствами объекта, потому что внутренняя функция не дает доступа метода в к объекту.
var add = function (a, b) {
return a + b;
};
var myObject = {
value: 10
}
myObject.double = function () {
var helper = function () {
this.value = add(this.value, this.value);
};
helper(); // Invoke helper as a function.
};
// Invoke double as a method.
myObject.double();
console.log(myObject.value);
Вызов Function как Function
К счастью, есть простой обходной путь.
var add = function (a, b) {
return a + b;
};
var myObject = {
value: 10
}
myObject.double = function () {
var that = this;
var helper = function () {
that.value = add(that.value, that.value);
};
helper(); // Invoke helper as a function.
};
// Invoke double as a method.
myObject.double();
console.log(myObject.value);
Вызов Function с конструктором
Function
Если вызову функции предшествует new, он является конструктором вызова.
Cоздается новая функция, но поскольку функции JavaScript являются объектами, то на
самом деле создается новый объект :
// This is a function constructor:
function myFunction(arg1, arg2) {
this.firstName = arg1;
this.lastName = arg2;
}
// This creates a new object
var x = new myFunction("Bilbo","Baggins");
x.firstName;
Приставка new также изменяет поведение оператора return.
Вызов Function с методом
Function
В JavaScript функции являются объектами. JavaScript функции имеют свойства и методы.
call() и apply() предопределенные методы функции JavaScript. Оба метода могут быть
использованы для вызова функции, и оба метода должны иметь объект владельцем в
качестве первого параметра. Единственное отличие состоит в том, что call() принимает
аргументы функции по отдельности, и apply() принимает аргументы функции в массиве..
var array = [3, 4];
var sum = add.apply(null, array);
Вызов Function с методом
Function
// Create a constructor function called Quo.It makes an object with a status property.
var Quo = function (string) {
this.status = string;
};
// Give all instances of Quo a public method called get_status.
Quo.prototype.get_status = function ( ) {
return this.status;
};
// Make an instance of Quo.
var myQuo = new Quo("confused");
console.log(myQuo.get_status()); // confused
// Make an object with a status member.
var statusObject = {
status: 'OK'
};
// statusObject does not inherit from Quo.prototype, but we can invoke the get_status
method on statusObject even though statusObject does not have a get_status method.
var status = Quo.prototype.get_status.apply(statusObject);
// status is 'OK'
Это всё, ребята!

More Related Content

What's hot (20)

Системийн шинжилгээ, зохиомж
Системийн шинжилгээ, зохиомжСистемийн шинжилгээ, зохиомж
Системийн шинжилгээ, зохиомж
Ганцоож Цэрэннадмид
метод посібник (практична частина)
метод посібник (практична частина)метод посібник (практична частина)
метод посібник (практична частина)
yulya cheholka
6_zbd_sh_2023.pdf
6_zbd_sh_2023.pdf6_zbd_sh_2023.pdf
6_zbd_sh_2023.pdf
LudaM3
Проект "Парк моєї мрії"
Проект "Парк моєї мрії"Проект "Парк моєї мрії"
Проект "Парк моєї мрії"
Елена Петриченко
Опис досвіду роботи
Опис досвіду роботи Опис досвіду роботи
Опис досвіду роботи
Vladimir Smirnov
Рекомендації з надання першої психологічної допомоги переселенцям
Рекомендації з надання першої психологічної допомоги переселенцямРекомендації з надання першої психологічної допомоги переселенцям
Рекомендації з надання першої психологічної допомоги переселенцям
UNDP Ukraine
Ээлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүй
Ээлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүйЭэлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүй
Ээлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүй
roza_toshke
Проект *Квітник нашої мрії*
Проект *Квітник нашої мрії*Проект *Квітник нашої мрії*
Проект *Квітник нашої мрії*
Alina Kapitula
Мобільні додатки доповненої реальності в освітньому процесі
Мобільні додатки доповненої реальності в освітньому процесіМобільні додатки доповненої реальності в освітньому процесі
Мобільні додатки доповненої реальності в освітньому процесі
Oleksii Voronkin
Презентація на тему: Комп'ютерна графіка
Презентація на тему: Комп'ютерна графікаПрезентація на тему: Комп'ютерна графіка
Презентація на тему: Комп'ютерна графіка
mishakarpovets1999
Інтерактивні технології у виховній роботі
Інтерактивні технології у виховній роботіІнтерактивні технології у виховній роботі
Інтерактивні технології у виховній роботі
Наталія Slavbibl4
Стратегія "Фішбоун"
Стратегія "Фішбоун" Стратегія "Фішбоун"
Стратегія "Фішбоун"
Vera Chepizhak
Зберігання інформації. Носії інформації.
Зберігання інформації. Носії інформації.Зберігання інформації. Носії інформації.
Зберігання інформації. Носії інформації.
V_Kobzar
методи морального виховання. тема 4
методи морального виховання. тема 4методи морального виховання. тема 4
методи морального виховання. тема 4
mad psychologist
лекция 1 основи едс
лекция 1 основи едслекция 1 основи едс
лекция 1 основи едс
наталия теличко
Oppimateriaalia verkosta!
Oppimateriaalia verkosta!Oppimateriaalia verkosta!
Oppimateriaalia verkosta!
Matleena Laakso
інформація, кодування
інформація, кодуванняінформація, кодування
інформація, кодування
kissoli
Формування культури здоров'я
Формування культури здоров'яФормування культури здоров'я
Формування культури здоров'я
tetana38
О.В.Радзімовська. Роль емоційно-вольової саморегуляції педагогів у розвитку д...
О.В.Радзімовська. Роль емоційно-вольової саморегуляції педагогів у розвитку д...О.В.Радзімовська. Роль емоційно-вольової саморегуляції педагогів у розвитку д...
О.В.Радзімовська. Роль емоційно-вольової саморегуляції педагогів у розвитку д...
Інститут післядипломної педагогічної освіти КУБГ
метод посібник (практична частина)
метод посібник (практична частина)метод посібник (практична частина)
метод посібник (практична частина)
yulya cheholka
6_zbd_sh_2023.pdf
6_zbd_sh_2023.pdf6_zbd_sh_2023.pdf
6_zbd_sh_2023.pdf
LudaM3
Опис досвіду роботи
Опис досвіду роботи Опис досвіду роботи
Опис досвіду роботи
Vladimir Smirnov
Рекомендації з надання першої психологічної допомоги переселенцям
Рекомендації з надання першої психологічної допомоги переселенцямРекомендації з надання першої психологічної допомоги переселенцям
Рекомендації з надання першої психологічної допомоги переселенцям
UNDP Ukraine
Ээлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүй
Ээлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүйЭэлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүй
Ээлжит хичээлийн хөтөлбөрүүд 9-р анги мэдээлэлзүй
roza_toshke
Проект *Квітник нашої мрії*
Проект *Квітник нашої мрії*Проект *Квітник нашої мрії*
Проект *Квітник нашої мрії*
Alina Kapitula
Мобільні додатки доповненої реальності в освітньому процесі
Мобільні додатки доповненої реальності в освітньому процесіМобільні додатки доповненої реальності в освітньому процесі
Мобільні додатки доповненої реальності в освітньому процесі
Oleksii Voronkin
Презентація на тему: Комп'ютерна графіка
Презентація на тему: Комп'ютерна графікаПрезентація на тему: Комп'ютерна графіка
Презентація на тему: Комп'ютерна графіка
mishakarpovets1999
Інтерактивні технології у виховній роботі
Інтерактивні технології у виховній роботіІнтерактивні технології у виховній роботі
Інтерактивні технології у виховній роботі
Наталія Slavbibl4
Стратегія "Фішбоун"
Стратегія "Фішбоун" Стратегія "Фішбоун"
Стратегія "Фішбоун"
Vera Chepizhak
Зберігання інформації. Носії інформації.
Зберігання інформації. Носії інформації.Зберігання інформації. Носії інформації.
Зберігання інформації. Носії інформації.
V_Kobzar
методи морального виховання. тема 4
методи морального виховання. тема 4методи морального виховання. тема 4
методи морального виховання. тема 4
mad psychologist
інформація, кодування
інформація, кодуванняінформація, кодування
інформація, кодування
kissoli
Формування культури здоров'я
Формування культури здоров'яФормування культури здоров'я
Формування культури здоров'я
tetana38

Viewers also liked (18)

Aprendizaje ubicuoAprendizaje ubicuo
Aprendizaje ubicuo
CLARISSA LEIVA
Número aureo.3.12 (3) SALASNúmero aureo.3.12 (3) SALAS
Número aureo.3.12 (3) SALAS
jehosua97
Sintecis 2 el hombre que calculaba avilaSintecis 2 el hombre que calculaba avila
Sintecis 2 el hombre que calculaba avila
jehosua97
Flores gutiérrez diablo 1 FLORES GFlores gutiérrez diablo 1 FLORES G
Flores gutiérrez diablo 1 FLORES G
jehosua97
Sanchez soriano diablo de los numeros 1SANCHEZSanchez soriano diablo de los numeros 1SANCHEZ
Sanchez soriano diablo de los numeros 1SANCHEZ
jehosua97
Carmen utilizando el internecCarmen utilizando el internec
Carmen utilizando el internec
ana barrios
El hombre que calculaba 2da s intesiisss leon cansinoEl hombre que calculaba 2da s intesiisss leon cansino
El hombre que calculaba 2da s intesiisss leon cansino
jehosua97
Sintesis2 hc ACEVEDOSintesis2 hc ACEVEDO
Sintesis2 hc ACEVEDO
jehosua97
Los cambios técnicos de los objetosLos cambios técnicos de los objetos
Los cambios técnicos de los objetos
anabelem110102
Nicotine Tob Res-2016-Chidiac-ntr_ntw250
Nicotine Tob Res-2016-Chidiac-ntr_ntw250Nicotine Tob Res-2016-Chidiac-ntr_ntw250
Nicotine Tob Res-2016-Chidiac-ntr_ntw250
Joseph Chidiac
Sintesis 1 del diablo de los numeros AVILASintesis 1 del diablo de los numeros AVILA
Sintesis 1 del diablo de los numeros AVILA
jehosua97
Odontologia (1)Odontologia (1)
Odontologia (1)
Meli Lopez
Segunda sintesis de mate flores gutierrezSegunda sintesis de mate flores gutierrez
Segunda sintesis de mate flores gutierrez
jehosua97
SK-1
SK-1SK-1
SK-1
Sachin Kadam
Diapositivassalussexualyreproductivafinal 120624140710-phpapp01Diapositivassalussexualyreproductivafinal 120624140710-phpapp01
Diapositivassalussexualyreproductivafinal 120624140710-phpapp01
Luis Alberto Talaga
προσκληση αγιασμου[611]
προσκληση αγιασμου[611]προσκληση αγιασμου[611]
προσκληση αγιασμου[611]
GAIA DRAMAS
Som - Física - ApresentaçãoSom - Física - Apresentação
Som - Física - Apresentação
danf97
Projeto matemática 6º anoProjeto matemática 6º ano
Projeto matemática 6º ano
Escola Costa e Silva
Aprendizaje ubicuoAprendizaje ubicuo
Aprendizaje ubicuo
CLARISSA LEIVA
Número aureo.3.12 (3) SALASNúmero aureo.3.12 (3) SALAS
Número aureo.3.12 (3) SALAS
jehosua97
Sintecis 2 el hombre que calculaba avilaSintecis 2 el hombre que calculaba avila
Sintecis 2 el hombre que calculaba avila
jehosua97
Flores gutiérrez diablo 1 FLORES GFlores gutiérrez diablo 1 FLORES G
Flores gutiérrez diablo 1 FLORES G
jehosua97
Sanchez soriano diablo de los numeros 1SANCHEZSanchez soriano diablo de los numeros 1SANCHEZ
Sanchez soriano diablo de los numeros 1SANCHEZ
jehosua97
Carmen utilizando el internecCarmen utilizando el internec
Carmen utilizando el internec
ana barrios
El hombre que calculaba 2da s intesiisss leon cansinoEl hombre que calculaba 2da s intesiisss leon cansino
El hombre que calculaba 2da s intesiisss leon cansino
jehosua97
Sintesis2 hc ACEVEDOSintesis2 hc ACEVEDO
Sintesis2 hc ACEVEDO
jehosua97
Los cambios técnicos de los objetosLos cambios técnicos de los objetos
Los cambios técnicos de los objetos
anabelem110102
Nicotine Tob Res-2016-Chidiac-ntr_ntw250
Nicotine Tob Res-2016-Chidiac-ntr_ntw250Nicotine Tob Res-2016-Chidiac-ntr_ntw250
Nicotine Tob Res-2016-Chidiac-ntr_ntw250
Joseph Chidiac
Sintesis 1 del diablo de los numeros AVILASintesis 1 del diablo de los numeros AVILA
Sintesis 1 del diablo de los numeros AVILA
jehosua97
Odontologia (1)Odontologia (1)
Odontologia (1)
Meli Lopez
Segunda sintesis de mate flores gutierrezSegunda sintesis de mate flores gutierrez
Segunda sintesis de mate flores gutierrez
jehosua97
Diapositivassalussexualyreproductivafinal 120624140710-phpapp01Diapositivassalussexualyreproductivafinal 120624140710-phpapp01
Diapositivassalussexualyreproductivafinal 120624140710-phpapp01
Luis Alberto Talaga
προσκληση αγιασμου[611]
προσκληση αγιασμου[611]προσκληση αγιασμου[611]
προσκληση αγιασμου[611]
GAIA DRAMAS
Som - Física - ApresentaçãoSom - Física - Apresentação
Som - Física - Apresentação
danf97
Projeto matemática 6º anoProjeto matemática 6º ano
Projeto matemática 6º ano
Escola Costa e Silva

Similar to функции в Java script (20)

Михаил Давыдов —JavaScript: Базовые знания
Михаил Давыдов —JavaScript: Базовые знанияМихаил Давыдов —JavaScript: Базовые знания
Михаил Давыдов —JavaScript: Базовые знания
Yandex
Михаил Давыдов - Транспорт, ajax
Михаил Давыдов - Транспорт, ajaxМихаил Давыдов - Транспорт, ajax
Михаил Давыдов - Транспорт, ajax
Yandex
Михаил Давыдов - JavaScript. Базовые знания
Михаил Давыдов - JavaScript. Базовые знанияМихаил Давыдов - JavaScript. Базовые знания
Михаил Давыдов - JavaScript. Базовые знания
Yandex
Поговорим о JavaScript, основы и современные тенденции развития языка
Поговорим о JavaScript, основы и современные тенденции развития языкаПоговорим о JavaScript, основы и современные тенденции развития языка
Поговорим о JavaScript, основы и современные тенденции развития языка
Alexander Kucherenko
Характерные черты функциональных языков программирования
Характерные черты функциональных языков программированияХарактерные черты функциональных языков программирования
Характерные черты функциональных языков программирования
Alex.Kolonitsky
JavaScript Базовый. Занятие 03.
JavaScript Базовый. Занятие 03.JavaScript Базовый. Занятие 03.
JavaScript Базовый. Занятие 03.
Igor Shkulipa
JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)
Mikhail Davydov
DevConf. Дмитрий Сошников - ECMAScript 6
DevConf. Дмитрий Сошников - ECMAScript 6DevConf. Дмитрий Сошников - ECMAScript 6
DevConf. Дмитрий Сошников - ECMAScript 6
Dmitry Soshnikov
Ecma script 6 in action
Ecma script 6 in actionEcma script 6 in action
Ecma script 6 in action
Yuri Trukhin
Solit 2014, EcmaScript 6 in Action, Трухин Юрий
Solit 2014, EcmaScript 6 in Action, Трухин Юрий Solit 2014, EcmaScript 6 in Action, Трухин Юрий
Solit 2014, EcmaScript 6 in Action, Трухин Юрий
solit
Объектное и прототипное программирование в Javascript
Объектное и прототипное программирование в JavascriptОбъектное и прототипное программирование в Javascript
Объектное и прототипное программирование в Javascript
Denis Latushkin
Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1
Vasya Petrov
Decorators' recipes
Decorators' recipesDecorators' recipes
Decorators' recipes
Yury Yurevich
особенности программирования на с++
особенности программирования на с++особенности программирования на с++
особенности программирования на с++
mcroitor
Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1
Vasya Petrov
Основы Python. Функции
Основы Python. ФункцииОсновы Python. Функции
Основы Python. Функции
Theoretical mechanics department
Михаил Давыдов: JavaScript. Базовые знания
Михаил Давыдов: JavaScript. Базовые знанияМихаил Давыдов: JavaScript. Базовые знания
Михаил Давыдов: JavaScript. Базовые знания
Yandex
Михаил Давыдов —JavaScript: Базовые знания
Михаил Давыдов —JavaScript: Базовые знанияМихаил Давыдов —JavaScript: Базовые знания
Михаил Давыдов —JavaScript: Базовые знания
Yandex
Михаил Давыдов - Транспорт, ajax
Михаил Давыдов - Транспорт, ajaxМихаил Давыдов - Транспорт, ajax
Михаил Давыдов - Транспорт, ajax
Yandex
Михаил Давыдов - JavaScript. Базовые знания
Михаил Давыдов - JavaScript. Базовые знанияМихаил Давыдов - JavaScript. Базовые знания
Михаил Давыдов - JavaScript. Базовые знания
Yandex
Поговорим о JavaScript, основы и современные тенденции развития языка
Поговорим о JavaScript, основы и современные тенденции развития языкаПоговорим о JavaScript, основы и современные тенденции развития языка
Поговорим о JavaScript, основы и современные тенденции развития языка
Alexander Kucherenko
Характерные черты функциональных языков программирования
Характерные черты функциональных языков программированияХарактерные черты функциональных языков программирования
Характерные черты функциональных языков программирования
Alex.Kolonitsky
JavaScript Базовый. Занятие 03.
JavaScript Базовый. Занятие 03.JavaScript Базовый. Занятие 03.
JavaScript Базовый. Занятие 03.
Igor Shkulipa
JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)
Mikhail Davydov
DevConf. Дмитрий Сошников - ECMAScript 6
DevConf. Дмитрий Сошников - ECMAScript 6DevConf. Дмитрий Сошников - ECMAScript 6
DevConf. Дмитрий Сошников - ECMAScript 6
Dmitry Soshnikov
Solit 2014, EcmaScript 6 in Action, Трухин Юрий
Solit 2014, EcmaScript 6 in Action, Трухин Юрий Solit 2014, EcmaScript 6 in Action, Трухин Юрий
Solit 2014, EcmaScript 6 in Action, Трухин Юрий
solit
Объектное и прототипное программирование в Javascript
Объектное и прототипное программирование в JavascriptОбъектное и прототипное программирование в Javascript
Объектное и прототипное программирование в Javascript
Denis Latushkin
Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1
Vasya Petrov
особенности программирования на с++
особенности программирования на с++особенности программирования на с++
особенности программирования на с++
mcroitor
Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1Подробная презентация JavaScript 6 в 1
Подробная презентация JavaScript 6 в 1
Vasya Petrov
Михаил Давыдов: JavaScript. Базовые знания
Михаил Давыдов: JavaScript. Базовые знанияМихаил Давыдов: JavaScript. Базовые знания
Михаил Давыдов: JavaScript. Базовые знания
Yandex

функции в Java script

  • 2. Функция JavaScript представляет собой блок кода, предназначенный для выполнения конкретной задачи. Функция JavaScript выполняется, когда "что-то" вызывает его (называет). Внутри функции, аргументы используются в качестве локальных переменных. functionName(parameter1, parameter2, parameter3) { code to be executed } JavaScript Functions function myFunction(p1, p2) { return p1 * p2; } var x = myFunction(5, 10); console.log(x);
  • 4. Вызов: ● При возникновении события (когда пользователь нажимает кнопку) ● Когда он вызывается (называется) из кода JavaScript ● Автоматически (сам вызывается) Возврат значения: Когда JavaScript достигает оператора возврата, то функция прекратит выполнение. Возвращаемое значение "возвращается" обратно в "вызывающей". Functions
  • 7. Определение Function Функции JavaScript определяются с помощью ключевого слова function. Вы можете использовать объявление function или expression function. Выражение функции может быть сохранено в переменной: var x = function (a, b) {return a * b}; После того, как выражение функция сохранена в переменной, переменная может быть использована в качестве функции: var z = x(4, 3); Функция выше фактически является анонимной функцией (функция без имени).
  • 8. Определение Function Конструктор Function(): var myFunction = new Function("a", "b", "return a * b"); // тоже самое что и var myFunction = function (a, b) {return a * b};
  • 10. Определение Function Demo: // v 1.1 function foo (a, b) { return a * b; } var z = foo (4, 3); console.log(z);
  • 11. Определение Function Demo : // v 1.1 function foo (a, b) { return a * b } var z = foo (4, 3); console.log(z); // v 1.2 var z = foo (4, 3); function foo (a, b) { return a * b; } console.log(z);
  • 12. Определение Function Способы: // v 1.1 function foo (a, b) { return a * b } var z = foo (4, 3); console.log(z); // v 1.2 var z = foo (4, 3); function foo (a, b) { return a * b } console.log(z); // v 1.3 var x = function (a, b) {return a * b}; var z = x(4, 3);
  • 13. Определение Function Demo : // v 1.1 function foo (a, b) { return a * b } var z = foo (4, 3); console.log(z); // v 1.2 var z = foo (4, 3); function foo (a, b) { return a * b } console.log(z); // v 1.3 var x = function (a, b) {return a * b}; var z = x(4, 3); // v 1.4 var z = x(4, 3); var x = function (a, b) {return a * b};
  • 14. Определение Function Demo : // v 1.1 function foo (a, b) { return a * b } var z = foo (4, 3); console.log(z); // v 1.2 var z = foo (4, 3); function foo (a, b) { return a * b } console.log(z); // v 1.3 var x = function (a, b) {return a * b}; var z = x(4, 3); // v 1.4 var z = x(4, 3); var x = function (a, b) {return a * b}; Чтооооо?
  • 15. Hoisting Hoisting - это поведение перемещения объявленных переменных к началу текущей области в JavaScript (по умолчанию). x = 5; // Assign 5 to x elem = document.getElementById("demo"); elem.innerHTML = x; var x; // Declare x JavaScript поднимает только объявление, но не инициализацию var x = 5; // Initialize x elem = document.getElementById("demo"); elem.innerHTML = x + " " + y; var y = 7; // Initialize y Чтобы избежать ошибок, всегда объявляйте все переменные в начале каждого scope!!!!!!
  • 17. Само вызывающиеся Function Вы должны добавить круглые скобки вокруг функции, чтобы указать, что это выражение функция: (function () { console.log("Hello!!"); // А вызову-ка сама себя })(); Для чего: - Предварительное вычисление - Создание scope
  • 18. Параметры Function Параметры функции являются имена, перечисленные в определении функции. Аргументы функции реальные значения, переданные (и полученные) функции. functionName(parameter1, parameter2, parameter3) { code to be executed } Параметры: ● Функций JavaScript типы данных для параметров не указываются. ● Функции JavaScript не выполняют проверку типов на переданных аргументов. ● Функции JavaScript не проверяют количество аргументов, полученных.
  • 19. Параметры Function Если функция вызывается с отсутствующими аргументами (меньше, чем объявлена), отсутствующие значения устанавливаются : undefined Присвоение значения по умолчанию для параметра : function myFunction(x, y) { y = y || 0; console.log(x, y) } Если функция вызывается слишком большим количеством аргументов (больше, чем декларируется), эти аргументы не могут быть переданы, потому что они не имеют названия. Они могут быть достигнуты только в объекте аргументов
  • 20. Arguments Object Объект аргумент содержит массив аргументов, используемых при вызове функции (x = sumAll(1, 123, 500, 115, 44, 88); function sumAll() { var i, sum = 0; for (i = 0; i < arguments.length; i++) { sum += arguments[i]; } return sum; } Аргументы в действительности не является массивом. Это массиво-подобный объект. Аргумент-объект имеет свойство длины, но у него не хватает всех методов массивов.
  • 21. Вызов Function Вызов функции приостанавливает выполнение текущей функции, передавая управление и параметры новой функции. В дополнение к заявленным параметрам, каждая функция получает два дополнительных параметра: this and arguments. В JavaScript this, является объектом, который "владеет" текущим кодом. Когда функция вызывается без объекта владельца, значение this становится глобальным объектом.
  • 22. Вызов Function как метода Когда функция сохраняется как свойство объекта, мы называем это метод. Связывания этого на объект происходит во время вызова. var myObject = { firstName:"Bilbo", lastName: "Baggins", fullName: function () { return this.firstName + " " + this.lastName; }, getContex: function () { return this; } } myObject.fullName(); myObject.getContex();
  • 23. Вызов Function как Function Функция не принадлежит ни одному объекту. В браузере объект страницы в окне браузера. Функция автоматически становится функцией window . function myFunction(a, b) { return a * b; } myFunction(10, 2); // myFunction(10, 2) will return 20 window.myFunction(10, 2); // window.myFunction(10, 2) will also return 20 function myFunction() { return this; } myFunction(); // Will return the window object
  • 24. Вызов Function как Function !!! Метод не может использовать внутреннюю функцию, чтобы помочь ему работать со свойствами объекта, потому что внутренняя функция не дает доступа метода в к объекту. var add = function (a, b) { return a + b; }; var myObject = { value: 10 } myObject.double = function () { var helper = function () { this.value = add(this.value, this.value); }; helper(); // Invoke helper as a function. }; // Invoke double as a method. myObject.double(); console.log(myObject.value);
  • 25. Вызов Function как Function К счастью, есть простой обходной путь. var add = function (a, b) { return a + b; }; var myObject = { value: 10 } myObject.double = function () { var that = this; var helper = function () { that.value = add(that.value, that.value); }; helper(); // Invoke helper as a function. }; // Invoke double as a method. myObject.double(); console.log(myObject.value);
  • 26. Вызов Function с конструктором Function Если вызову функции предшествует new, он является конструктором вызова. Cоздается новая функция, но поскольку функции JavaScript являются объектами, то на самом деле создается новый объект : // This is a function constructor: function myFunction(arg1, arg2) { this.firstName = arg1; this.lastName = arg2; } // This creates a new object var x = new myFunction("Bilbo","Baggins"); x.firstName; Приставка new также изменяет поведение оператора return.
  • 27. Вызов Function с методом Function В JavaScript функции являются объектами. JavaScript функции имеют свойства и методы. call() и apply() предопределенные методы функции JavaScript. Оба метода могут быть использованы для вызова функции, и оба метода должны иметь объект владельцем в качестве первого параметра. Единственное отличие состоит в том, что call() принимает аргументы функции по отдельности, и apply() принимает аргументы функции в массиве.. var array = [3, 4]; var sum = add.apply(null, array);
  • 28. Вызов Function с методом Function // Create a constructor function called Quo.It makes an object with a status property. var Quo = function (string) { this.status = string; }; // Give all instances of Quo a public method called get_status. Quo.prototype.get_status = function ( ) { return this.status; }; // Make an instance of Quo. var myQuo = new Quo("confused"); console.log(myQuo.get_status()); // confused // Make an object with a status member. var statusObject = { status: 'OK' }; // statusObject does not inherit from Quo.prototype, but we can invoke the get_status method on statusObject even though statusObject does not have a get_status method. var status = Quo.prototype.get_status.apply(statusObject); // status is 'OK'