Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
So why do you need to
know Algorithms and
Data Structures in
Front-end, anyway
Adam Leos
Adam Leos
● Старший разработчик
PlutoTV
Adam Leos
● Старший разработчик
PlutoTV
● Автор веб-дополнения
UnlimitedControl
https://adam4leos.github.io/
Статья на
Хабре:
● Русский
● English
Adam Leos
● Старший разработчик
PlutoTV
● Автор веб-дополнения
UnlimitedControl
● Докладчик-идеолог
Что вы видите,
это не то, что
исполняется ©
Что вы видите,
это не то, что
исполняется ©
Нет плохого
кода, а есть
плохие
компиляторы ©
Сложность алгоритма
Сложность алгоритма
Big O notation, O
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Сложность алгоритма
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n)...
Algorithm Complexity
Big O notation, O
Omega notation, Ω
Theta Notation, θ
asymptotic notations, asymptotic complexity
O(n...
Сложность алгоритма
Сложность алгоритма
Как будет расти расход ресурсов* с
увеличением размера входных данных.
Сложность алгоритма
Как будет расти расход ресурсов* с
увеличением размера входных данных.
* время и память
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}...
Сложность алгоритма
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}...
Сложность алгоритма
Как будет расти расход ресурсов* с
увеличением размера входных данных.
* время и память
Big O notation, O
Big O notation, O
Big O notation, O
Функция, которая описывает рост сложности
алгоритма.
Big O notation, O
function sumNumbersInArray(array) {
let sum = 0;
array.forEach(number => sum += number);
return sum;
}
Размер входных данных, ед.
Размер входных данных, ед.
1
Размер входных данных, ед.
1 100
Размер входных данных, ед.
1 100 1000
Размер входных данных, ед.
1 100 1000 10000
Размер входных данных, ед.
1 100 1000 10000
Размер входных данных, ед.
1 100 1000 10000
Количествоопераций
Размер входных данных, ед.
1 100 1000 10000
Количествоопераций
1
100
1000
10000
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
Количествоопераций
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(n)
Количествоопераций
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(n) - линейная
Количествоопераций
Big O
function simpleCalculate() {
const a = 1 + 2;
const b = 3 + 4;
console.log('calculating...');
return b - a;
}
simple...
Big O
function simpleCalculate() {
const a = 1 + 2;
const b = 3 + 4;
console.log('calculating...');
return b - a;
}
simple...
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(1)
Количествоопераций
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(1) - константная (постоянная)
Количествоопераций
Big O
function simpleCalculate(number) {
const a = 1 + 2;
const b = 3 + 4;
console.log('calculating...');
return b - a + n...
Big O
function simpleCalculate(number) {
const a = 1 + 2;
const b = 3 + 4;
console.log('calculating...');
return b - a + n...
Big O
function simpleCalculate(array) {
const a = 1 + 2;
const b = 3 + 4;
let additionalNumber = 0;
array.forEach(num => a...
Big O
function simpleCalculate(array) {
const a = 1 + 2;
const b = 3 + 4;
let additionalNumber = 0;
array.forEach(num => a...
Big O
function simpleCalculate(array) {
const a = 1 + 2;
const b = 3 + 4;
const additionalNumber = array.length;
return b ...
Big O
function simpleCalculate(array) {
const a = 1 + 2;
const b = 3 + 4;
const additionalNumber = array.length;
return b ...
Big O
function notSoSimpleCalculate(array) {
for (let i = 0; i < array.length; i++) {
for (let j = 0; j < array.length; j+...
Big O
function notSoSimpleCalculate(array) {
for (let i = 0; i < array.length; i++) {
for (let j = 0; j < array.length; j+...
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(n^2) - квадратичная
Количествоопераций
Big O
function notSoSimpleCalculate(array) {
array.forEach(num => console.log(num));
for (let i = 0; i < array.length; i++...
Big O
function notSoSimpleCalculate(array) {
array.forEach(num => console.log(num));
for (let i = 0; i < array.length; i++...
Big O
function mightBeSimpleCalculate(array) {
let total = 0;
array.forEach(num => {
const additional = array.indexOf(num)...
Big O
function mightBeSimpleCalculate(array) {
let total = 0;
array.forEach(num => {
const additional = array.indexOf(num)...
Big O
function mightBeSimpleCalculate(array) {
let total = 0;
array.forEach(num => {
const additional = array.indexOf(num)...
Big O
function mightBeSimpleCalculate(array) {
let total = 0;
array.forEach((num, index) => {
const additional = index > 5...
Пример роста в цифрах
Пример роста в цифрах
Входные данные - 10000 элементов
Пример роста в цифрах
O(1) - 1
Входные данные - 10000 элементов
Пример роста в цифрах
O(1) - 1
O(n) - 10000
Входные данные - 10000 элементов
Пример роста в цифрах
O(1) - 1
O(n) - 10000
O(n^2) - 100000000 (сто миллионов)
Входные данные - 10000 элементов
Пример роста в цифрах
O(1) - 1
O(n) - 10000
O(n^2) - 100000000 (сто миллионов)
O(n^3) - 1000000000000 (один триллион)
Вход...
Пример роста в цифрах
O(1) - 1
O(n) - 10000
O(n^2) - 100000000 (сто миллионов)
O(n^3) - 1000000000000 (один триллион)
O(n!...
Структуры данных
Структуры данных
Определенный способ организации
данных для максимально эффективного
использования
Структуры данных
● Доступ (получить данные)
● Поиск (найти данные)
● Вставка (добавить данные)
● Удаление (удалить данные)
Структуры данных
1. Массивы
Массивы
const arr = [1, 2, 3];
Массивы
const arr = [1, 2, 3];
arr[1]; // 2
Массивы
const arr = [1, 2, 3];
arr[1]; // 2 O(1)
Массивы
const arr = [1, 2, 3];
arr[1]; // 2
arr[2]; // 3
O(1)
O(1)
Массивы
const arr = [1, 2, 3];
arr[1]; // 2
arr[2]; // 3
arr[9]; // undefined
O(1)
O(1)
O(1)
Массивы
const arr = [1, 2, 3];
arr[1]; // 2
arr[2]; // 3
arr[9]; // undefined
arr[0] = 4; // [4, 2, 3]
O(1)
O(1)
O(1)
O(1)
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4] O(1)*
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3]
O(1)*
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3] O(1)
O(1)*
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3]
arr.shift(); // [2, 3]
O(1)
O(1)*
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3]
arr.shift(); // [2, 3]
O(1)
O(n)
O(1)*
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3]
arr.shift(); // [2, 3]
arr.unshift(4);...
Массивы
const arr = [1, 2, 3];
arr.push(4); // [1, 2, 3, 4]
arr.pop(); // [1, 2, 3]
arr.shift(); // [2, 3]
arr.unshift(4);...
Массивы O(n)
Массивы
.map()
.slice()
.every()
.filter()
.indexOf()
.reduce()
.reverse()
.find()
.includes()
.toString()
O(n)
Структуры данных
1. Массивы
2. Объекты
Объекты
const obj = {
id: 1,
name: 'Adam',
};
Объекты
const obj = {
id: 1,
name: 'Adam',
};
obj.id // 1
Объекты
const obj = {
id: 1,
name: 'Adam',
};
obj.id // 1 O(1)
Объекты
const obj = {
id: 1,
name: 'Adam',
};
obj.id // 1
obj['name'] // 1
O(1)
O(1)
Объекты
const obj = {
id: 1,
name: 'Adam',
};
obj.surname = 'Leos';
obj['name'] = [];
O(1)
O(1)
Объекты
const obj = {
id: 1,
name: 'Adam',
};
Object.keys(obj) // ['id', 'name']
Object.values(obj) // [1, 'Adam']
Объекты
const obj = {
id: 1,
name: 'Adam',
};
Object.keys(obj) // ['id', 'name']
Object.values(obj) // [1, 'Adam']
O(n)
O(...
Объекты Посчитать символы в строке
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
function countSymbols(string) {
const dict = {};
for (let i = 0; i < string.length; i++) {
const iterableSymbol = ...
Объекты
countSymbols('adam') // Object { a: 2, d: 1, m: 1 }
countSymbols('mississippi') // Object { m: 1, i: 4, s: 4, p: 2...
Полезный мапинг в
реальном мире
const shows = [
{
id: 1,
name: 'Rick and Morty',
categories: [
'Comedy',
'Animated',
'Science',
],
data: 1001010101001011,...
const shows = [
{
id: 1,
name: 'Rick and Morty',
categories: [
'Comedy',
'Animated',
'Science',
],
data: 1001010101001011,...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function ineffectiveBanning(shows) {
shows.forEach(show => {
const { id: showID } = show;
bannedShows.forEach(bannedShow =...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
function effectiveBanning(shows) {
const bannedShowsIDMap = {};
bannedShows.forEach(bannedShow => {
const { id: bannedShow...
Память в реальном мире
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels
.filter(filterEmptyTimelines)
.map(addId...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels.reduce((acc, channel) => {
if (hasEmptyT...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels.reduce((acc, channel) => {
if (hasEmptyT...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels.reduce((acc, channel) => {
if (hasEmptyT...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels.reduce((acc, channel) => {
if (hasEmptyT...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels.reduce((acc, channel) => {
if (hasEmptyT...
function enchanceApiResponse(apiResponse) {
const channels = apiResponse.channels.reduce((acc, channel) => {
if (hasEmptyT...
Структуры данных
1. Массивы
2. Объекты
3. Графы
Граф
Граф
Вершина (узел)
Граф
Вершина (узел)
Ребро
Граф
Вершина (узел)
Ребро
1
13
9
54
11
6
70
Граф
1
13
9
54
11
6
70
Граф
1
13
9
54
11
6
70
Value (data) = 6
Граф
1
13
9
54
11
6
70
Value (data) = 6
Connections = [13, 70]
node = {
value: 6,
connections: [13, 70],
}
node = {
value: 6,
connections: [13, 70],
}
class Node {
}
node = {
value: 6,
connections: [13, 70],
}
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}...
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Graph {
}
class Graph {
constructor() {
this.nodes = [];
}
}
class Graph {
constructor() {
this.nodes = [];
}
addNode(node) {
this.nodes.push(node);
}
}
class Graph {
constructor() {
this.nodes = [];
}
addNode(node) {
this.nodes.push(node);
}
addEdge(node1, node2) {
node1.ad...
Граф
1
13
9
54
11
6
70
class Graph {
constructor() {
this.nodes = {};
}
addNode(node) {
this.nodes.push(node);
}
addEdge(node1, node2) {
node1.ad...
class Graph {
constructor() {
this.nodes = {};
}
addNode(node) {
this.nodes.push(node);
}
addEdge(node1, node2) {
node1.ad...
Граф Гугл-карт
Kharkiv - [Lviv];
Lviv - [Kharkiv, Odessa];
Odessa - [Lviv];
Граф Гугл-карт
Kharkiv - [Lviv];
Lviv - [Kharkiv, Odessa];
Odessa - [Lviv];
Seattle
San Francisco
Las Vegas
Salt Lake City...
Граф Гугл-карт
Kharkiv - [Lviv];
Lviv - [Kharkiv, Odessa];
Odessa - [Lviv];
const googleRoute = new Graph();
const googleRoute = new Graph();
const seattle = new Node('Seattle');
const sanFrancisco = new Node('San Francisco');
cons...
const googleRoute = new Graph();
const seattle = new Node('Seattle');
const sanFrancisco = new Node('San Francisco');
cons...
const googleRoute = new Graph();
const seattle = new Node('Seattle');
const sanFrancisco = new Node('San Francisco');
cons...
const googleRoute = new Graph();
const seattle = new Node('Seattle');
const sanFrancisco = new Node('San Francisco');
cons...
const googleRoute = new Graph();
const seattle = new Node('Seattle');
const sanFrancisco = new Node('San Francisco');
cons...
const googleRoute = new Graph();
const seattle = new Node('Seattle');
const sanFrancisco = new Node('San Francisco');
cons...
Логистика
1
13
9
54
11
6
70
Граф
Граф - ориентированный
1
13
9
54
11
6
70
1
13
9
54
11
6
70
4
2
7
20
8
1
Граф - взешенный
Где еще используются графы
1. Сеть (маршрутизация данных).
2. Логистика (маршруты, направления).
3. Телекоммуникации (план...
Структуры данных
1. Массивы
2. Объекты
3. Графы
4. Деревья
1
13
9 54 11
6
70
Деревья
1
13
9 54 11
6
70
Деревья
=
Связный
ацикличный
граф
1
13
9 54 11
6
70
Деревья
=
Связный
ацикличный
граф
1
13
9 54 11
6
70
Деревья
=
Связный
ацикличный
граф
DOM дерево
const settings = {
};
const settings = {
options: [
],
};
const settings = {
options: [
{
},
{
},
{
},
// ...
],
};
const settings = {
options: [
{
name: 'video',
options: [...],
},
{
name: 'sound',
options: [...],
},
{
name: 'security',
...
const settings = {
options: [
{
name: 'video',
options: [...],
},
{
name: 'sound',
options: [...],
},
{
name: 'security',
...
Алгоритмы
Алгоритмы
1. Поиск
function find(number, array) {
array.forEach((iterableNumber, index) => {
if (iterableNumber === number) {
console.log(`Fo...
function find(number, array) {
array.forEach((iterableNumber, index) => {
if (iterableNumber === number) {
console.log(`Fo...
Поиск. Бинарный vs Последовательный
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
function binarySearch(number, array) {
let startIndex = 0;
let endIndex = array.length - 1;
while (startIndex <= endIndex)...
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(logn) - логарифмическая
Количествоопераций
Размер входных данных, ед.
1 100 1000 10000
1
100
1000
10000
O(logn) - логарифмическая
2el => 1
4el => 2
8el => 3
1000el =...
Бинарное
Дерево
1
13
9 54 11
6
70
Бинарное
Дерево
1
3
9 54 11
6
70
Бинарное
Дерево
1
3
5 54 11
6
70
Бинарное
Дерево
1
3
5 54 71
6
70
Поиск. Бинарное дерево
class Node {
constructor(value) {
this.value = value;
this.connections = [];
}
addConnection(node) {
this.connections.push...
class Node {
constructor(value) {
this.value = value;
this.left = null;
this.right = null;
}
}
class Tree {
constructor() {
this.root = null;
}
}
class Tree {
constructor() {
this.root = null
}
insert(data) {
const newNode = new Node(data);
if (this.root === null) {
t...
Бинарное дерево
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
insertNode(parentNode = this.head, newNode) {
if (newNode.data < parentNode.data) {
if (parentNode.left === null) parentNo...
Алгоритмы
1. Поиск
2. Сортировки
Сортировка Пузырьком
(bubble sort)
O(n^2)
Сортировка Пузырьком
(bubble sort)
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
function bubble(arr) {
const length = arr.length;
for (let i = 0; i < length; i++) {
for (let j = 0; j < length - i - 1; j...
Сортировка слиянием
(Merge sort)
O(n * logn)
Сортировка слиянием
(Merge sort)
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function mergeSort(unsortedArray) {
if (unsortedArray.length <= 1) {
return unsortedArray;
}
const middle = Math.floor(uns...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
function merge(left, right) {
const resultArray = [];
let leftIndex = 0;
let rightIndex = 0;
while (leftIndex < left.lengt...
Память vs. Время
Bogosort
(самая неэффективная сортировка)
O(n * n!)Bogosort
(самая неэффективная сортировка)
Уже хорошо
работает
Array.sort()
Уже хорошо
работает
Array.sort()
Разные имплементации в
разных браузерах. (и в
разных версиях).
Уже хорошо
работает
Array.sort()
Разные имплементации в
разных браузерах. (и в
разных версиях).
В целом, базируется на
сор...
Уже хорошо
работает
Array.sort()
Разные имплементации в
разных браузерах. (и в
разных версиях).
В целом, базируется на
сор...
Заключение
Заключение
● Вам не нужно знать все алгоритмы и структуры данных. Самые
необходимые знания, дающие больше всего пользы, в ...
Заключение
● Вам не нужно знать все алгоритмы и структуры данных. Самые
необходимые знания, дающие больше всего пользы, в ...
Заключение
● Вам не нужно знать все алгоритмы и структуры данных. Самые
необходимые знания, дающие больше всего пользы, в ...
Материалы
Теория
● Оценка Сложности алгоритма
● Асимптотический анализ алгоритмов
● Структуры данных для самых маленьких
●...
Q&A
Слайды
Telegram - @adam4leos
LinkedIn - Adam Leos
adam.leos@pm.me
Контакты
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway
Upcoming SlideShare
Loading in …5
×

of

JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 1 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 2 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 3 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 4 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 5 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 6 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 7 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 8 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 9 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 10 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 11 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 12 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 13 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 14 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 15 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 16 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 17 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 18 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 19 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 20 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 21 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 22 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 23 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 24 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 25 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 26 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 27 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 28 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 29 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 30 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 31 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 32 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 33 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 34 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 35 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 36 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 37 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 38 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 39 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 40 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 41 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 42 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 43 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 44 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 45 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 46 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 47 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 48 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 49 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 50 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 51 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 52 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 53 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 54 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 55 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 56 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 57 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 58 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 59 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 60 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 61 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 62 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 63 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 64 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 65 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 66 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 67 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 68 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 69 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 70 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 71 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 72 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 73 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 74 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 75 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 76 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 77 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 78 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 79 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 80 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 81 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 82 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 83 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 84 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 85 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 86 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 87 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 88 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 89 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 90 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 91 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 92 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 93 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 94 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 95 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 96 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 97 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 98 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 99 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 100 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 101 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 102 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 103 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 104 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 105 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 106 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 107 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 108 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 109 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 110 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 111 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 112 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 113 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 114 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 115 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 116 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 117 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 118 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 119 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 120 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 121 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 122 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 123 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 124 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 125 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 126 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 127 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 128 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 129 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 130 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 131 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 132 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 133 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 134 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 135 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 136 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 137 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 138 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 139 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 140 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 141 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 142 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 143 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 144 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 145 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 146 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 147 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 148 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 149 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 150 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 151 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 152 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 153 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 154 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 155 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 156 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 157 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 158 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 159 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 160 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 161 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 162 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 163 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 164 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 165 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 166 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 167 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 168 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 169 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 170 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 171 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 172 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 173 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 174 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 175 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 176 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 177 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 178 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 179 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 180 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 181 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 182 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 183 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 184 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 185 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 186 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 187 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 188 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 189 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 190 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 191 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 192 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 193 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 194 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 195 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 196 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 197 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 198 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 199 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 200 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 201 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 202 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 203 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 204 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 205 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 206 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 207 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 208 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 209 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 210 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 211 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 212 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 213 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 214 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 215 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 216 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 217 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 218 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 219 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 220 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 221 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 222 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 223 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 224 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 225 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 226 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 227 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 228 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 229 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 230 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 231 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 232 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 233 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 234 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 235 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 236 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 237 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 238 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 239 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 240 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 241 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 242 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 243 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 244 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 245 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 246 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 247 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 248 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 249 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 250 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 251 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 252 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 253 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 254 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 255 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 256 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 257 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 258 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 259 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 260 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 261 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 262 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 263 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 264 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 265 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 266 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 267 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 268 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 269 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 270 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 271 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 272 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 273 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 274 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 275 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 276 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 277 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 278 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 279 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 280 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 281 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 282 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 283 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 284 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 285 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 286 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 287 JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway Slide 288
Upcoming SlideShare
What to Upload to SlideShare
Next

0 Likes

Share

JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway

During the presentation, we will consider what advantages a front-end developer will get from knowledge of algorithms and data structures.
We will analyze real-world examples where this knowledge simplified logic and accelerated applications dramatically.
And finally we will understand the most necessary things that will allow us to determine the effectiveness of the code and easily improve it.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

JS Fest 2019/Autumn. Adam Leos. So why do you need to know Algorithms and Data Structures in Front-end, anyway

  1. 1. So why do you need to know Algorithms and Data Structures in Front-end, anyway
  2. 2. Adam Leos
  3. 3. Adam Leos ● Старший разработчик PlutoTV
  4. 4. Adam Leos ● Старший разработчик PlutoTV ● Автор веб-дополнения UnlimitedControl
  5. 5. https://adam4leos.github.io/
  6. 6. Статья на Хабре: ● Русский ● English
  7. 7. Adam Leos ● Старший разработчик PlutoTV ● Автор веб-дополнения UnlimitedControl ● Докладчик-идеолог
  8. 8. Что вы видите, это не то, что исполняется ©
  9. 9. Что вы видите, это не то, что исполняется © Нет плохого кода, а есть плохие компиляторы ©
  10. 10. Сложность алгоритма
  11. 11. Сложность алгоритма Big O notation, O
  12. 12. Сложность алгоритма Big O notation, O Omega notation, Ω
  13. 13. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ
  14. 14. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations
  15. 15. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity
  16. 16. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n)
  17. 17. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n)
  18. 18. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn)
  19. 19. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic
  20. 20. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic polynomial
  21. 21. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic polynomial Ο(f(n)) = { g(n) : there exists c > 0 and n0 such that f(n) ≤ c.g(n) for all n > n0 . }
  22. 22. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic polynomial Ο(f(n)) = { g(n) : there exists c > 0 and n0 such that f(n) ≤ c.g(n) for all n > n0 . } c and n0 are constants, f(n) and g(n) are functions over non-negative integers
  23. 23. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic polynomial Ο(f(n)) = { g(n) : there exists c > 0 and n0 such that f(n) ≤ c.g(n) for all n > n0 . } c and n0 are constants, f(n) and g(n) are functions over non-negative integers
  24. 24. Сложность алгоритма Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic polynomial Ο(f(n)) = { g(n) : there exists c > 0 and n0 such that f(n) ≤ c.g(n) for all n > n0 . } c and n0 are constants, f(n) and g(n) are functions over non-negative integers
  25. 25. Algorithm Complexity Big O notation, O Omega notation, Ω Theta Notation, θ asymptotic notations, asymptotic complexity O(n) Ο(log n) O(n * logn) logarithmic polynomial Ο(f(n)) = { g(n) : there exists c > 0 and n0 such that f(n) ≤ c.g(n) for all n > n0 . } c and n0 are constants, f(n) and g(n) are functions over non-negative integers
  26. 26. Сложность алгоритма
  27. 27. Сложность алгоритма Как будет расти расход ресурсов* с увеличением размера входных данных.
  28. 28. Сложность алгоритма Как будет расти расход ресурсов* с увеличением размера входных данных. * время и память
  29. 29. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  30. 30. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  31. 31. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  32. 32. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  33. 33. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  34. 34. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  35. 35. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; } sumNumbersInArray([1, 2, 3, 4, 5]);
  36. 36. Сложность алгоритма function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; } sumNumbersInArray([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
  37. 37. Сложность алгоритма Как будет расти расход ресурсов* с увеличением размера входных данных. * время и память
  38. 38. Big O notation, O
  39. 39. Big O notation, O
  40. 40. Big O notation, O Функция, которая описывает рост сложности алгоритма.
  41. 41. Big O notation, O function sumNumbersInArray(array) { let sum = 0; array.forEach(number => sum += number); return sum; }
  42. 42. Размер входных данных, ед.
  43. 43. Размер входных данных, ед. 1
  44. 44. Размер входных данных, ед. 1 100
  45. 45. Размер входных данных, ед. 1 100 1000
  46. 46. Размер входных данных, ед. 1 100 1000 10000
  47. 47. Размер входных данных, ед. 1 100 1000 10000
  48. 48. Размер входных данных, ед. 1 100 1000 10000 Количествоопераций
  49. 49. Размер входных данных, ед. 1 100 1000 10000 Количествоопераций 1 100 1000 10000
  50. 50. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 Количествоопераций
  51. 51. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(n) Количествоопераций
  52. 52. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(n) - линейная Количествоопераций
  53. 53. Big O function simpleCalculate() { const a = 1 + 2; const b = 3 + 4; console.log('calculating...'); return b - a; } simpleCalculate();
  54. 54. Big O function simpleCalculate() { const a = 1 + 2; const b = 3 + 4; console.log('calculating...'); return b - a; } simpleCalculate(); O(1)
  55. 55. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(1) Количествоопераций
  56. 56. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(1) - константная (постоянная) Количествоопераций
  57. 57. Big O function simpleCalculate(number) { const a = 1 + 2; const b = 3 + 4; console.log('calculating...'); return b - a + number; } simpleCalculate(8);
  58. 58. Big O function simpleCalculate(number) { const a = 1 + 2; const b = 3 + 4; console.log('calculating...'); return b - a + number; } simpleCalculate(8); O(1)
  59. 59. Big O function simpleCalculate(array) { const a = 1 + 2; const b = 3 + 4; let additionalNumber = 0; array.forEach(num => additionalNumber += num); return b - a + additionalNumber; } simpleCalculate([1, 2, 5, 10, 1223]);
  60. 60. Big O function simpleCalculate(array) { const a = 1 + 2; const b = 3 + 4; let additionalNumber = 0; array.forEach(num => additionalNumber += num); return b - a + additionalNumber; } simpleCalculate([1, 2, 5, 10, 1223]); O(n)
  61. 61. Big O function simpleCalculate(array) { const a = 1 + 2; const b = 3 + 4; const additionalNumber = array.length; return b - a + additionalNumber; } simpleCalculate([1, 2, 5, 10, 1223]);
  62. 62. Big O function simpleCalculate(array) { const a = 1 + 2; const b = 3 + 4; const additionalNumber = array.length; return b - a + additionalNumber; } simpleCalculate([1, 2, 5, 10, 1223]); O(1)
  63. 63. Big O function notSoSimpleCalculate(array) { for (let i = 0; i < array.length; i++) { for (let j = 0; j < array.length; j++) { array[i] = array[i] + array[j]; } } return array; } notSoSimpleCalculate([1, 2, 3]);
  64. 64. Big O function notSoSimpleCalculate(array) { for (let i = 0; i < array.length; i++) { for (let j = 0; j < array.length; j++) { array[i] = array[i] + array[j]; } } return array; } notSoSimpleCalculate([1, 2, 3]); O(n^2)
  65. 65. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(n^2) - квадратичная Количествоопераций
  66. 66. Big O function notSoSimpleCalculate(array) { array.forEach(num => console.log(num)); for (let i = 0; i < array.length; i++) { for (let j = 0; j < array.length; j++) { array[i] = array[i] + array[j]; } } return array; }
  67. 67. Big O function notSoSimpleCalculate(array) { array.forEach(num => console.log(num)); for (let i = 0; i < array.length; i++) { for (let j = 0; j < array.length; j++) { array[i] = array[i] + array[j]; } } return array; } O(n^2)
  68. 68. Big O function mightBeSimpleCalculate(array) { let total = 0; array.forEach(num => { const additional = array.indexOf(num) > 5 ? 5 : 1; total = total + num + additional; }); return array; }
  69. 69. Big O function mightBeSimpleCalculate(array) { let total = 0; array.forEach(num => { const additional = array.indexOf(num) > 5 ? 5 : 1; total = total + num + additional; }); return array; } O(n^2)
  70. 70. Big O function mightBeSimpleCalculate(array) { let total = 0; array.forEach(num => { const additional = array.indexOf(num) > 5 ? 5 : 1; total = total + num + additional; }); return array; } O(n^2)
  71. 71. Big O function mightBeSimpleCalculate(array) { let total = 0; array.forEach((num, index) => { const additional = index > 5 ? 5 : 1; total = total + num + additional; }); return array; } O(n)
  72. 72. Пример роста в цифрах
  73. 73. Пример роста в цифрах Входные данные - 10000 элементов
  74. 74. Пример роста в цифрах O(1) - 1 Входные данные - 10000 элементов
  75. 75. Пример роста в цифрах O(1) - 1 O(n) - 10000 Входные данные - 10000 элементов
  76. 76. Пример роста в цифрах O(1) - 1 O(n) - 10000 O(n^2) - 100000000 (сто миллионов) Входные данные - 10000 элементов
  77. 77. Пример роста в цифрах O(1) - 1 O(n) - 10000 O(n^2) - 100000000 (сто миллионов) O(n^3) - 1000000000000 (один триллион) Входные данные - 10000 элементов
  78. 78. Пример роста в цифрах O(1) - 1 O(n) - 10000 O(n^2) - 100000000 (сто миллионов) O(n^3) - 1000000000000 (один триллион) O(n!) очень много 100000000000000000000000000000000000000000000000000000000 000000000000000000000000000000000000000000000000000000000 000000000000000000000000000000000000000000000000000000…… Входные данные - 10000 элементов
  79. 79. Структуры данных
  80. 80. Структуры данных Определенный способ организации данных для максимально эффективного использования
  81. 81. Структуры данных ● Доступ (получить данные) ● Поиск (найти данные) ● Вставка (добавить данные) ● Удаление (удалить данные)
  82. 82. Структуры данных 1. Массивы
  83. 83. Массивы const arr = [1, 2, 3];
  84. 84. Массивы const arr = [1, 2, 3]; arr[1]; // 2
  85. 85. Массивы const arr = [1, 2, 3]; arr[1]; // 2 O(1)
  86. 86. Массивы const arr = [1, 2, 3]; arr[1]; // 2 arr[2]; // 3 O(1) O(1)
  87. 87. Массивы const arr = [1, 2, 3]; arr[1]; // 2 arr[2]; // 3 arr[9]; // undefined O(1) O(1) O(1)
  88. 88. Массивы const arr = [1, 2, 3]; arr[1]; // 2 arr[2]; // 3 arr[9]; // undefined arr[0] = 4; // [4, 2, 3] O(1) O(1) O(1) O(1)
  89. 89. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4]
  90. 90. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] O(1)*
  91. 91. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] arr.pop(); // [1, 2, 3] O(1)*
  92. 92. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] arr.pop(); // [1, 2, 3] O(1) O(1)*
  93. 93. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] arr.pop(); // [1, 2, 3] arr.shift(); // [2, 3] O(1) O(1)*
  94. 94. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] arr.pop(); // [1, 2, 3] arr.shift(); // [2, 3] O(1) O(n) O(1)*
  95. 95. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] arr.pop(); // [1, 2, 3] arr.shift(); // [2, 3] arr.unshift(4); // [4, 2, 3] O(1) O(n) O(1)*
  96. 96. Массивы const arr = [1, 2, 3]; arr.push(4); // [1, 2, 3, 4] arr.pop(); // [1, 2, 3] arr.shift(); // [2, 3] arr.unshift(4); // [4, 2, 3] O(1) O(n) O(n) O(1)*
  97. 97. Массивы O(n)
  98. 98. Массивы .map() .slice() .every() .filter() .indexOf() .reduce() .reverse() .find() .includes() .toString() O(n)
  99. 99. Структуры данных 1. Массивы 2. Объекты
  100. 100. Объекты const obj = { id: 1, name: 'Adam', };
  101. 101. Объекты const obj = { id: 1, name: 'Adam', }; obj.id // 1
  102. 102. Объекты const obj = { id: 1, name: 'Adam', }; obj.id // 1 O(1)
  103. 103. Объекты const obj = { id: 1, name: 'Adam', }; obj.id // 1 obj['name'] // 1 O(1) O(1)
  104. 104. Объекты const obj = { id: 1, name: 'Adam', }; obj.surname = 'Leos'; obj['name'] = []; O(1) O(1)
  105. 105. Объекты const obj = { id: 1, name: 'Adam', }; Object.keys(obj) // ['id', 'name'] Object.values(obj) // [1, 'Adam']
  106. 106. Объекты const obj = { id: 1, name: 'Adam', }; Object.keys(obj) // ['id', 'name'] Object.values(obj) // [1, 'Adam'] O(n) O(n)
  107. 107. Объекты Посчитать символы в строке
  108. 108. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  109. 109. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  110. 110. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  111. 111. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  112. 112. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  113. 113. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  114. 114. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  115. 115. Объекты function countSymbols(string) { const dict = {}; for (let i = 0; i < string.length; i++) { const iterableSymbol = string[i]; if (dict[iterableSymbol] === undefined) dict[iterableSymbol] = 0; dict[iterableSymbol]++; } return dict; } Посчитать символы в строке
  116. 116. Объекты countSymbols('adam') // Object { a: 2, d: 1, m: 1 } countSymbols('mississippi') // Object { m: 1, i: 4, s: 4, p: 2 } Посчитать символы в строке
  117. 117. Полезный мапинг в реальном мире
  118. 118. const shows = [ { id: 1, name: 'Rick and Morty', categories: [ 'Comedy', 'Animated', 'Science', ], data: 1001010101001011, }, {/.../}, {/.../}, {/.../}, {/.../}, ];
  119. 119. const shows = [ { id: 1, name: 'Rick and Morty', categories: [ 'Comedy', 'Animated', 'Science', ], data: 1001010101001011, }, {/.../}, {/.../}, {/.../}, {/.../}, ]; const bannedShows = [ { id: 1, name: 'Rick and Morty', categories: [ 'Comedy', 'Animated', 'Science', ], }, {/.../}, ];
  120. 120. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  121. 121. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  122. 122. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  123. 123. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  124. 124. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  125. 125. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  126. 126. function ineffectiveBanning(shows) { shows.forEach(show => { const { id: showID } = show; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; if (showID === bannedShowID) { show.isBanned = true; }; }); }); };
  127. 127. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); };
  128. 128. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); };
  129. 129. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); };
  130. 130. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); };
  131. 131. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); };
  132. 132. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); };
  133. 133. function effectiveBanning(shows) { const bannedShowsIDMap = {}; bannedShows.forEach(bannedShow => { const { id: bannedShowID } = bannedShow; bannedShowsIDMap[bannedShowID] = true; }; shows.forEach(show => { const { id: showID } = show; if (bannedShowsIDMap[showID]) show.isBanned = true; }); }; x100
  134. 134. Память в реальном мире
  135. 135. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  136. 136. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  137. 137. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  138. 138. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  139. 139. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  140. 140. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  141. 141. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  142. 142. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels .filter(filterEmptyTimelines) .map(addIdentificator) .map(modifyImages) .map(removeParams) .map(setSession) // more code }
  143. 143. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels.reduce((acc, channel) => { if (hasEmptyTimelines(channel.timelines)) { return acc; } const enchancedChannel = setChannelURL(reduceImagesObject(addIDToChannel(channel))); acc.push(enchancedChannel); return acc; }, []); // more code }
  144. 144. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels.reduce((acc, channel) => { if (hasEmptyTimelines(channel.timelines)) { return acc; } const enchancedChannel = setChannelURL(reduceImagesObject(addIDToChannel(channel))); acc.push(enchancedChannel); return acc; }, []); // more code }
  145. 145. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels.reduce((acc, channel) => { if (hasEmptyTimelines(channel.timelines)) { return acc; } const enchancedChannel = setChannelURL(reduceImagesObject(addIDToChannel(channel))); acc.push(enchancedChannel); return acc; }, []); // more code }
  146. 146. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels.reduce((acc, channel) => { if (hasEmptyTimelines(channel.timelines)) { return acc; } const enchancedChannel = setChannelURL(reduceImagesObject(addIDToChannel(channel))); acc.push(enchancedChannel); return acc; }, []); // more code }
  147. 147. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels.reduce((acc, channel) => { if (hasEmptyTimelines(channel.timelines)) { return acc; } const enchancedChannel = setChannelURL(reduceImagesObject(addIDToChannel(channel))); acc.push(enchancedChannel); return acc; }, []); // more code }
  148. 148. function enchanceApiResponse(apiResponse) { const channels = apiResponse.channels.reduce((acc, channel) => { if (hasEmptyTimelines(channel.timelines)) { return acc; } const enchancedChannel = setChannelURL(reduceImagesObject(addIDToChannel(channel))); acc.push(enchancedChannel); return acc; }, []); // more code } 10-30%
  149. 149. Структуры данных 1. Массивы 2. Объекты 3. Графы
  150. 150. Граф
  151. 151. Граф Вершина (узел)
  152. 152. Граф Вершина (узел) Ребро
  153. 153. Граф Вершина (узел) Ребро 1 13 9 54 11 6 70
  154. 154. Граф 1 13 9 54 11 6 70
  155. 155. Граф 1 13 9 54 11 6 70 Value (data) = 6
  156. 156. Граф 1 13 9 54 11 6 70 Value (data) = 6 Connections = [13, 70]
  157. 157. node = { value: 6, connections: [13, 70], }
  158. 158. node = { value: 6, connections: [13, 70], } class Node { }
  159. 159. node = { value: 6, connections: [13, 70], } class Node { constructor(value) { this.value = value; this.connections = []; } }
  160. 160. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } } node = { value: 6, connections: [13, 70], }
  161. 161. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } } node = { value: 6, connections: [13, 70], } const six = new Node(6);
  162. 162. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } } node = { value: 6, connections: [13, 70], } const six = new Node(6); six.value; // 6
  163. 163. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } } node = { value: 6, connections: [13, 70], } const six = new Node(6); six.value; // 6 const thirteen = new Node(13); const seventy = new Node(70);
  164. 164. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } } node = { value: 6, connections: [13, 70], } const six = new Node(6); six.value; // 6 const thirteen = new Node(13); const seventy = new Node(70); six.addConnection(thirteen); six.addConnection(seventy);
  165. 165. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } } node = { value: 6, connections: [13, 70], } const six = new Node(6); six.value; // 6 const thirteen = new Node(13); const seventy = new Node(70); six.addConnection(thirteen); six.addConnection(seventy); six.connections; // [{ value: 13, connections: [] }, { value: 70, connections: [] }];
  166. 166. class Graph { }
  167. 167. class Graph { constructor() { this.nodes = []; } }
  168. 168. class Graph { constructor() { this.nodes = []; } addNode(node) { this.nodes.push(node); } }
  169. 169. class Graph { constructor() { this.nodes = []; } addNode(node) { this.nodes.push(node); } addEdge(node1, node2) { node1.addConnection(node2); node2.addConnection(node1); }; }
  170. 170. Граф 1 13 9 54 11 6 70
  171. 171. class Graph { constructor() { this.nodes = {}; } addNode(node) { this.nodes.push(node); } addEdge(node1, node2) { node1.addConnection(node2); node2.addConnection(node1); }; } const ourGraph = new Graph(); const one = new Node(1); const six = new Node(6); const nine = new Node(9); const eleven = new Node(11); const thirteen = new Node(13); const fiftyFour = new Node(54); const seventy = new Node(70);
  172. 172. class Graph { constructor() { this.nodes = {}; } addNode(node) { this.nodes.push(node); } addEdge(node1, node2) { node1.addConnection(node2); node2.addConnection(node1); }; } ourGraph.addNode(one); ourGraph.addNode(six); ourGraph.addNode(nine); ourGraph.addNode(eleven); ourGraph.addNode(thirteen); ourGraph.addNode(fiftyFour); ourGraph.addNode(seventy); ourGraph.addEdge(one, thirteen); ourGraph.addEdge(nine, thirteen); ourGraph.addEdge(nine, fiftyFour); ourGraph.addEdge(thirteen, eleven); ourGraph.addEdge(thirteen, six); ourGraph.addEdge(six, seventy);
  173. 173. Граф Гугл-карт Kharkiv - [Lviv]; Lviv - [Kharkiv, Odessa]; Odessa - [Lviv];
  174. 174. Граф Гугл-карт Kharkiv - [Lviv]; Lviv - [Kharkiv, Odessa]; Odessa - [Lviv]; Seattle San Francisco Las Vegas Salt Lake City San Francisco
  175. 175. Граф Гугл-карт Kharkiv - [Lviv]; Lviv - [Kharkiv, Odessa]; Odessa - [Lviv];
  176. 176. const googleRoute = new Graph();
  177. 177. const googleRoute = new Graph(); const seattle = new Node('Seattle'); const sanFrancisco = new Node('San Francisco'); const lasVegas = new Node('Las Vegas'); const saltLakeCity = new Node('Salt Lake City');
  178. 178. const googleRoute = new Graph(); const seattle = new Node('Seattle'); const sanFrancisco = new Node('San Francisco'); const lasVegas = new Node('Las Vegas'); const saltLakeCity = new Node('Salt Lake City'); const seattleData = { name: 'Seattle', coordinates: [ 47.7471188, -125.6412592, ], state: 'WA', country: 'USA', weather: 'Sunny', /.../ };
  179. 179. const googleRoute = new Graph(); const seattle = new Node('Seattle'); const sanFrancisco = new Node('San Francisco'); const lasVegas = new Node('Las Vegas'); const saltLakeCity = new Node('Salt Lake City'); googleRoute.addNode(seattle); googleRoute.addNode(sanFrancisco); googleRoute.addNode(lasVegas); googleRoute.addNode(saltLakeCity);
  180. 180. const googleRoute = new Graph(); const seattle = new Node('Seattle'); const sanFrancisco = new Node('San Francisco'); const lasVegas = new Node('Las Vegas'); const saltLakeCity = new Node('Salt Lake City'); googleRoute.addNode(seattle); googleRoute.addNode(sanFrancisco); googleRoute.addNode(lasVegas); googleRoute.addNode(saltLakeCity); googleRoute.addEdge(seattle, sanFrancisco); googleRoute.addEdge(sanFrancisco, lasVegas); googleRoute.addEdge(lasVegas, saltLakeCity); googleRoute.addEdge(saltLakeCity, sanFrancisco);
  181. 181. const googleRoute = new Graph(); const seattle = new Node('Seattle'); const sanFrancisco = new Node('San Francisco'); const lasVegas = new Node('Las Vegas'); const saltLakeCity = new Node('Salt Lake City'); googleRoute.addNode(seattle); googleRoute.addNode(sanFrancisco); googleRoute.addNode(lasVegas); googleRoute.addNode(saltLakeCity); googleRoute.addEdge(seattle, sanFrancisco); googleRoute.addEdge(sanFrancisco, lasVegas); googleRoute.addEdge(lasVegas, saltLakeCity); googleRoute.addEdge(saltLakeCity, sanFrancisco); sanFrancisco.connections = [ seattle, lasVegas, saltLakeCity, ];
  182. 182. const googleRoute = new Graph(); const seattle = new Node('Seattle'); const sanFrancisco = new Node('San Francisco'); const lasVegas = new Node('Las Vegas'); const saltLakeCity = new Node('Salt Lake City'); googleRoute.addNode(seattle); googleRoute.addNode(sanFrancisco); googleRoute.addNode(lasVegas); googleRoute.addNode(saltLakeCity); googleRoute.addEdge(seattle, sanFrancisco); googleRoute.addEdge(sanFrancisco, lasVegas); googleRoute.addEdge(lasVegas, saltLakeCity); googleRoute.addEdge(saltLakeCity, sanFrancisco); sanFrancisco.connections = [ seattle, lasVegas, saltLakeCity, ]; seattle.connections = [ sanFrancisco ];
  183. 183. Логистика
  184. 184. 1 13 9 54 11 6 70 Граф
  185. 185. Граф - ориентированный 1 13 9 54 11 6 70
  186. 186. 1 13 9 54 11 6 70 4 2 7 20 8 1 Граф - взешенный
  187. 187. Где еще используются графы 1. Сеть (маршрутизация данных). 2. Логистика (маршруты, направления). 3. Телекоммуникации (планирование частот вышек). 4. Социальные сети (возможные знакомые). 5. Рекомендации. 6. Схемы. 7. И еще очень много где.
  188. 188. Структуры данных 1. Массивы 2. Объекты 3. Графы 4. Деревья
  189. 189. 1 13 9 54 11 6 70 Деревья
  190. 190. 1 13 9 54 11 6 70 Деревья = Связный ацикличный граф
  191. 191. 1 13 9 54 11 6 70 Деревья = Связный ацикличный граф
  192. 192. 1 13 9 54 11 6 70 Деревья = Связный ацикличный граф
  193. 193. DOM дерево
  194. 194. const settings = { };
  195. 195. const settings = { options: [ ], };
  196. 196. const settings = { options: [ { }, { }, { }, // ... ], };
  197. 197. const settings = { options: [ { name: 'video', options: [...], }, { name: 'sound', options: [...], }, { name: 'security', options: [...], }, // ... ], };
  198. 198. const settings = { options: [ { name: 'video', options: [...], }, { name: 'sound', options: [...], }, { name: 'security', options: [...], }, // ... ], }; [ { name: 'subtitles', options: [...], }, { name: 'brightness', options: [...], }, // ... ];
  199. 199. Алгоритмы
  200. 200. Алгоритмы 1. Поиск
  201. 201. function find(number, array) { array.forEach((iterableNumber, index) => { if (iterableNumber === number) { console.log(`Found at index ${index}`); } }); }
  202. 202. function find(number, array) { array.forEach((iterableNumber, index) => { if (iterableNumber === number) { console.log(`Found at index ${index}`); } }); } O(n)
  203. 203. Поиск. Бинарный vs Последовательный
  204. 204. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  205. 205. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  206. 206. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  207. 207. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  208. 208. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  209. 209. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  210. 210. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  211. 211. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  212. 212. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  213. 213. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  214. 214. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } }
  215. 215. function binarySearch(number, array) { let startIndex = 0; let endIndex = array.length - 1; while (startIndex <= endIndex) { const middleIndex = Math.floor((startIndex + endIndex) / 2); const middleValue = array[middleIndex]; if (middleValue === number) { console.log(`Found at index ${middleIndex}`); } else if (middleValue < number) { startIndex = middleIndex + 1; } else { endIndex = middleIndex - 1; } } } O(logn)
  216. 216. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(logn) - логарифмическая Количествоопераций
  217. 217. Размер входных данных, ед. 1 100 1000 10000 1 100 1000 10000 O(logn) - логарифмическая 2el => 1 4el => 2 8el => 3 1000el => ~10 10000el => ~13 100000el => ~16 Количествоопераций
  218. 218. Бинарное Дерево 1 13 9 54 11 6 70
  219. 219. Бинарное Дерево 1 3 9 54 11 6 70
  220. 220. Бинарное Дерево 1 3 5 54 11 6 70
  221. 221. Бинарное Дерево 1 3 5 54 71 6 70
  222. 222. Поиск. Бинарное дерево
  223. 223. class Node { constructor(value) { this.value = value; this.connections = []; } addConnection(node) { this.connections.push(node); } }
  224. 224. class Node { constructor(value) { this.value = value; this.left = null; this.right = null; } }
  225. 225. class Tree { constructor() { this.root = null; } }
  226. 226. class Tree { constructor() { this.root = null } insert(data) { const newNode = new Node(data); if (this.root === null) { this.root = newNode; } else { this.insertNode(this.root, newNode); } } }
  227. 227. Бинарное дерево
  228. 228. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  229. 229. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  230. 230. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  231. 231. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  232. 232. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  233. 233. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  234. 234. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  235. 235. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  236. 236. insertNode(parentNode = this.head, newNode) { if (newNode.data < parentNode.data) { if (parentNode.left === null) parentNode.left = newNode; else { this.insertNode(parentNode.left, newNode); } } else { if (parentNode.right === null) parentNode.right = newNode; else { this.insertNode(parentNode.right, newNode); } } }
  237. 237. Алгоритмы 1. Поиск 2. Сортировки
  238. 238. Сортировка Пузырьком (bubble sort)
  239. 239. O(n^2) Сортировка Пузырьком (bubble sort)
  240. 240. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  241. 241. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  242. 242. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  243. 243. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  244. 244. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  245. 245. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  246. 246. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  247. 247. function bubble(arr) { const length = arr.length; for (let i = 0; i < length; i++) { for (let j = 0; j < length - i - 1; j++) { const current = arr[j]; const next = arr[j + 1]; if (current > next) { arr[j] = next; arr[j + 1] = current; } } } return arr; }
  248. 248. Сортировка слиянием (Merge sort)
  249. 249. O(n * logn) Сортировка слиянием (Merge sort)
  250. 250. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  251. 251. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  252. 252. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  253. 253. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  254. 254. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  255. 255. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  256. 256. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  257. 257. function mergeSort(unsortedArray) { if (unsortedArray.length <= 1) { return unsortedArray; } const middle = Math.floor(unsortedArray.length / 2); const left = unsortedArray.slice(0, middle); const right = unsortedArray.slice(middle); return merge( mergeSort(left), mergeSort(right) ); }
  258. 258. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  259. 259. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  260. 260. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  261. 261. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  262. 262. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  263. 263. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  264. 264. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  265. 265. function merge(left, right) { const resultArray = []; let leftIndex = 0; let rightIndex = 0; while (leftIndex < left.length && rightIndex < right.length) { if (left[leftIndex] < right[rightIndex]) { resultArray.push(left[leftIndex]); leftIndex++; } else { resultArray.push(right[rightIndex]); rightIndex++; } } return resultArray .concat(left.slice(leftIndex)) .concat(right.slice(rightIndex)); }
  266. 266. Память vs. Время
  267. 267. Bogosort (самая неэффективная сортировка)
  268. 268. O(n * n!)Bogosort (самая неэффективная сортировка)
  269. 269. Уже хорошо работает Array.sort()
  270. 270. Уже хорошо работает Array.sort() Разные имплементации в разных браузерах. (и в разных версиях).
  271. 271. Уже хорошо работает Array.sort() Разные имплементации в разных браузерах. (и в разных версиях). В целом, базируется на сортировках слиянием и быстрой сортировке (в зависимости от типа данных в массиве).
  272. 272. Уже хорошо работает Array.sort() Разные имплементации в разных браузерах. (и в разных версиях). В целом, базируется на сортировках слиянием и быстрой сортировке (в зависимости от типа данных в массиве). + на небольших массивах (до 10 элементов) используется сортировка вставками.
  273. 273. Заключение
  274. 274. Заключение ● Вам не нужно знать все алгоритмы и структуры данных. Самые необходимые знания, дающие больше всего пользы, в то же время являются и самыми простыми в освоении.
  275. 275. Заключение ● Вам не нужно знать все алгоритмы и структуры данных. Самые необходимые знания, дающие больше всего пользы, в то же время являются и самыми простыми в освоении. ● Нет необходимости помнить все реализации, вы даже можете забыть какие-то самые важные. Достаточно один раз разобраться в них, чтобы иметь представление о возможностях.
  276. 276. Заключение ● Вам не нужно знать все алгоритмы и структуры данных. Самые необходимые знания, дающие больше всего пользы, в то же время являются и самыми простыми в освоении. ● Нет необходимости помнить все реализации, вы даже можете забыть какие-то самые важные. Достаточно один раз разобраться в них, чтобы иметь представление о возможностях. ● Анализируйте ваши алгоритмы. Задумывайтесь над их эффективностью. Чем эффективнее код вы создаете, тем производительнее и надежнее будет ваш продукт (и тем круче вы станете как разработчик)
  277. 277. Материалы Теория ● Оценка Сложности алгоритма ● Асимптотический анализ алгоритмов ● Структуры данных для самых маленьких ● The complexity of simple algorithms and data structures in JS ● Introduction to Data Structures and Algorithms Практика ● Data Structures ● Fundamentals of Algorithms ● HackerRank
  278. 278. Q&A Слайды Telegram - @adam4leos LinkedIn - Adam Leos adam.leos@pm.me Контакты

During the presentation, we will consider what advantages a front-end developer will get from knowledge of algorithms and data structures. We will analyze real-world examples where this knowledge simplified logic and accelerated applications dramatically. And finally we will understand the most necessary things that will allow us to determine the effectiveness of the code and easily improve it.

Views

Total views

418

On Slideshare

0

From embeds

0

Number of embeds

1

Actions

Downloads

0

Shares

0

Comments

0

Likes

0

×