4.75M
Category: programmingprogramming

Разработка программных модулей

1.

Разработка
программных модулей

2.

Стрелочные функции. Try…catch
Стрелочные функции (arrow functions) позволяют сократить определение
обычных функций. Стрелочные функции определяются с помощью оператора
=>, перед которым в скобках идут параметры функции, а после - собственно
тело функции.
(параметры) => действия_функции
2

3.

Стрелочные функции. Try…catch
Для примера возьмем сначала обычную примитивную функцию, которая
выводит сообщение на консоль:
function hello(){
console.log("Hello");
}
hello(); // вызываем функцию
Теперь переделаем ее в стрелочную функцию:
const hello = ()=> console.log("Hello");
hello();
3

4.

Стрелочные функции. Try…catch
В данном случае стрелочная функция присваивается константе hello, через
которую затем можно вызвать данную функцию.
Здесь мы не используем параметры, поэтому указываются пустые скобки ()=>
console.log("Hello");
Далее через имя переменной мы можем вызвать данную функцию.
4

5.

Стрелочные функции. Try…catch
Теперь определим стрелочную функцию, которая принимает один параметр:
const print = (mes)=> console.log(mes);
print("Hello world");
print("Welcome to JavaScript");
Здесь стрелочная функция принимает один параметр mes, значение которого
выводится на консоль браузера.
5

6.

Стрелочные функции. Try…catch
Если стрелочная функция имеет только один параметр, то скобки вокруг
списка параметров можно опустить:
const print = mes=> console.log(mes);
print("Hello world");
print("Welcome to JavaScript");
6

7.

Стрелочные функции. Try…catch
Другой пример - передадим два параметра:
const sum = (x, y)=> console.log("Sum =", x + y);
sum(1, 2); // Sum = 3
sum(4, 3); // Sum = 7
sum(103, 2); // Sum = 105
7

8.

Стрелочные функции. Try…catch
Чтобы возвратить значение из стрелочной функции, нам достаточно указать
его после стрелки. Например, определим функцию, которая возвращает
сумму двух чисел:
const sum = (x, y)=> x + y;
console.log(sum(1, 2)); // 3
console.log(sum(4, 3)); // 7
console.log(sum(102, 5)); // 107
8

9.

Стрелочные функции. Try…catch
Другой пример - возвратим отформатированную строку:
const hello = name => `Hello, ${name}`;
console.log(hello("Tom"));
// Hello, Tom
console.log(hello("Bob"));
// Hello, Bob
console.log(hello("Frodo Baggins")); // Hello, Frodo Baggins
В данном случае функция hello принимает один параметр name - условное
имя и создает на его основе сообщение с приветствием.
9

10.

Стрелочные функции. Try…catch
Особо следует остановиться на случае, когда стрелочная функция возвращает
объект:
const user = (userName, userAge) => ({name: userName, age: userAge});
let tom = user("Tom", 34);
let bob = user("Bob", 25);
console.log(tom.name, tom.age); // "Tom", 34
console.log(bob.name, bob.age); // "Bob", 25
Объект также определяется с помощью фигурных скобок, но при этом он
заключается в круглые скобки.
10

11.

Стрелочные функции. Try…catch
Выше в примерах все стрелочные функции имели только одну инструкцию.
Если же функция должна выполнять больше действий, то они, как и в
обычной функции, заключаются в фигурные скобки:
const square = n => {
const result = n * n;
console.log(result);
}
square(5);
square(6);
// 25
// 36
11

12.

Стрелочные функции. Try…catch
А если надо возвратить результат, применяется оператор return, как в
обычной функции:
const square = n => {
const result = n * n;
return result;
}
console.log(square(5));
// 25
12

13.

Стрелочные функции. Try…catch
В процессе работы программы могут возникать различные ошибки, которые
нарушают привычный ход программы и даже заставляют ее прервать
выполнение. Язык JavaScript имеет инструменты для обработки таких
ситуаций.
Простейшая ситуация - вызов функции, которой не существует:
callSomeFunc();
console.log("Остальные инструкции");
13

14.

Стрелочные функции. Try…catch
Для обработки подобных ситуаций JavaScript предоставляет конструкцию
try...catch...finally, которая имеет следующее формальное определение:
try {
инструкции блока try
}
catch (error) {
инструкции блока catch
}
finally {
инструкции блока finally
}
14

15.

Стрелочные функции. Try…catch
После оператора try определяется блок кода. В этот блок помещаются инструкции,
при выполнении которых может возникнуть потенциальная ошибка.
Затем идет оператор catch. После этого оператора в круглых скобках указывается
название объекта, который будет содержать информацию об ошибке. И далее идет
блок catch. Этот блок выполняется только при возникновении ошибки в блоке try.
После блока catch идет оператор finally со своим блоком инструкций. Этот блок
выполняется в конце после блока try и catch вне зависимости, возникла ошибка или
нет.
Стоит отметить, что только блок try является обязательным. А один из остальных
блоков - catch или finally мы можем опустить. Однако один из этих блоков (не важно
catch или finally) обязательно должен присуствовать. То есть мы можем использовать
следующие варианты этой конструкции:
• try...catch
• try...finally
• try...catch...finally
15

16.

Стрелочные функции. Try…catch
Например, обработаем с помощью этой конструкцию предыдущую ситуацию с
несуществующей функцией:
try{
callSomeFunc();
console.log("Конец блока try");
}
catch{
console.log("Возникла ошибка!");
}
console.log("Остальные инструкции");
16

17.

Стрелочные функции. Try…catch
Рассмотрим другой пример:
function callSomeFunc(){console.log("Функция callSomeFunc");}
try{
callSomeFunc();
console.log("Конец блока try");
}
catch(error){
console.log("Возникла ошибка!");
}
console.log("Остальные инструкции");
Теперь функция callSomeFunc() определена в программе, поэтому при вызове
функции ошибки не произойдет, и блок try доработает до конца. А блок catch при
отсутствии ошибки не будет выполняться. Каким будет консольный вывод?
17

18.

Стрелочные функции. Try…catch
В качестве в качестве параметра в блок catch передается объект с информацией об
ошибке:
try{
callSomeFunc();
console.log("Конец блока try");
}
catch(error){
console.log("Возникла ошибка!");
console.log(error);
}
В этом случае мы получим консольный вывод на подобие следующего:
Возникла ошибка!
ReferenceError: callSomeFunc is not defined
18

19.

Стрелочные функции. Try…catch
Конструкция try также может содержать блок finally. Мы можем использовать этот блок
вместе с блоком catch или вместо него. Блок finally выполняется вне зависимости,
произошла ошибка или нет. Например:
try{
callSomeFunc();
console.log("Конец блока try");
}
catch{
console.log("Произошла ошибка");
}
finally{
console.log("Блок finally")
}
console.log("Остальные инструкции");
19

20.

Стрелочные функции. Try…catch
Если мы уберем блок catch и оставим только блок finally, то ошибка не будет
обработана, и программа завершится ошибкой. Однако блок finally все равно
выполнится:
try{
callSomeFunc();
console.log("Конец блока try");
}
finally{
console.log("Блок finally")
}
console.log("Остальные инструкции");
20

21.

Стрелочные функции. Try…catch
Рассмотрим следующую ситуацию:
class Person{
constructor(name, age){
this.name = name;
this.age = age;
}
print(){ console.log(`Name: ${this.name} Age: ${this.age}`);}
}
const tom = new Person("Tom", -123);
tom.print(); // Name: Tom Age: -123
21

22.

Стрелочные функции. Try…catch
Класс Person описывает человека. В конструкторе класс получает значения для свойств
name (имя) и age (возраст). Исходя из здравого смысла мы понимаем, что возраст не
может быть отрицательным. Тем не менее пока, исходя из логики класса, ничего не
мешает при создании объекта Person передать ему для возраста отрицательное
значение. С точки зрения интерпретатора JavaScript ошибки нет, однако с точки логики
и здравого смысла - это ошибка. Как исправить эту ситуацию? Есть различные способы,
и один из них заключается в генерации исключения.
Для генерации исключения применяется оператор throw, после которого указывается
информация об ошибке:
throw информация_об_ошибке;
22

23.

Стрелочные функции. Try…catch
Информация об ошибке может представлять любой объект.
Так, сгенерируем исключение при передаче в конструктор Person отрицательного
значения для свойства age:
class Person{
constructor(name, age){
if(age < 0) throw "Возраст должен быть положительным";
this.name = name;
this.age = age;
}
print(){ console.log(`Name: ${this.name} Age: ${this.age}`);}
}
const tom = new Person("Tom", -123); // Uncaught Возраст должен быть
положительным
tom.print();
23

24.

Стрелочные функции. Try…catch
В итоге при вызове конструктора Person будет сгенерировано исключение и программа
завершится ошибкой. А на консоли браузера мы увидим информацию об ошибке,
которая указана после оператора throw:
Uncaught Возраст должен быть положительным
24

25.

Стрелочные функции. Try…catch
Как и в общем случае мы можем обработать эту ошибку с помощью блока try...catch:
class Person{
constructor(name, age){
if(age < 0) throw "Возраст должен быть положительным";
this.name = name;
this.age = age;
}
print(){ console.log(`Name: ${this.name} Age: ${this.age}`);}
}
try{
const tom = new Person("Tom", -123); // Uncaught Возраст должен быть
положительным
tom.print();
25

26.

Стрелочные функции. Try…catch
Оператор throw позволяет сгенерировать «кастомное» сообщение об ошибке и может
вызываться в различных контекстах, например, в том же блоке try:
try{
throw "Непредвиденная ошибка!";
}
catch(error){
console.log(error); // Непредвиденная ошибка!
}
Это может быть полезно по ряду причин. Во-первых, мы можем тут же обработать
ошибку. Во-вторых, мы можем определить с помощью блока finally некоторые
завершающие действия, которые будут выполняться, даже если сгенерирована ошибка.
26

27.

Стрелочные функции. Try…catch
Виды ошибок:
27

28.

Стрелочные функции. Try…catch
Проверка нескольких ошибок осуществляется по следующему шаблону:
try {
try {
} catch (error) {
throw 1;
}
switch (true) {
catch(e) {
case (error instanceof ForbiddenError): {
if (e instanceof ReferenceError) {
// action
// action
break;
} else if (typeof e === "string") {
}
// action
case (error instanceof UserError): {
} else {
// action
// General error action here
break;
}
}
}
default: {
finally {}
// log, cuz this is weird;
}
28

29.

Задание
Реализуйте логику функции checkAge для проверки возраста и генерации
ошибки в случае, если он < 18.
function checkAge(age) {
//писать код сюда
}
try {
console.log(checkAge(15));
} catch (err) {
console.log(err); // "вывод Доступ запрещён - вы слишком молоды!"
}
29

30.

Домашнее задание
Закончить выполнение задания со слайда 29.

31.

Спасибо за внимание!
English     Русский Rules