Web Interview

2021-09-24 20:09:02 #junior
#node.js
#вопрос

Вопрос:
Как асинхронно записать файл в node.js?

Ответ:
Мало кто знает, но с недавних временем в node.js появилась возможность записи файла через встроенный модуль в fs - promises.
Это сильно упрощает понимание кода и пропадает надобность в сallback, т.к теперь мы можем использовать async/await.

Пример:
import * as fs from 'fs'; // импортируем модуль fs

async function write(file) {
 await fs.promises.writeFile('/static', 'test.txt', file.buffer); // первым аргументом передаем путь, вторым название файла, третьим буфер файла

 // выполняем код после записи файла
}
write(file) // вызываем функцию записи, передаем в нее файл.

Примечание:
Обратите внимание, что данный способ будет работать только с Promise, либо в асинхронной функции (async/await), иначе вы не сможете подождать запись файла.

Web Interview Открыть/Комментировать

2021-09-22 11:03:54 #middle
#js
#вопрос

Вопрос:
Что такое объект Set?

Ответ:
Объект Set позволяет хранить уникальные значения, примитивы и ссылки на объекты. Нужно понимать, что в Set можно добавлять только уникальные значения. Он проверяет хранящиеся в нем значения с помощью алгоритма Same Zero Value.

Примеры:
Экземпляр Set создается с помощью конструктора Set. Мы также можем передать ему некоторые значения при создании:

const setEmpty = new Set()// создаем пустой экземпляр Set

const set = new Set(['1','2','3','4','4','5']) //вторая "4" не добавится

Мы можем добавлять значения в Set, используя метод add. Т.к метод add является возвращаемым, можно использовать цепочку вызовов (call chain):

set.add('0')
set.add('6').add('12').add('15').add('11').add('5') // используем цепочку вызовов, вторая "5" не добавится.

Удалять значения из Set можно, используя метод delete:

set.delete('2') // true
set.delete('7') // false, потому что в set нет такого значения

set.has('2') //наличие свойства в Set

Web Interview Открыть/Комментировать

2021-09-19 13:17:05 #middle
#js
#задача

Задача:
• Вывести значения переменной i в консоль.
• Между выводами должна быть задержка в 1 секунду.
• Вывод должен отображать значение переменной на каждой итерации.
• Для решения задачи код можно менять только в теле цикла.

Пример кода:
for (let i = []; i.length < 3; i.push(1)) {
// ваше решение
}

Решение:
for (let i = []; i.length < 3; i.push(1)) {
 const newI = [...i]
 setTimeout(() => console.log(newI), i.length * 1000);
}

Примечание:
Если написать просто setTimeout с console.log(i), то в консоли появится 3 одинаковых значения. Это происходит потому, что ко времени срабатывания тайм-аута, цикл уже отработает.
Для решения задачи мы создаём локальную переменную и копируем значения из i (если не скопировать, то newI будет меняться вместе с i из-за того что массив - ссылочный тип)

Чтобы вывести значения с интервалом в секунду, нужно использовать длину массива i:
i.length * 1000

Web Interview Открыть/Комментировать

2021-09-18 19:52:34 #senior
#html
#вопрос

Вопрос:
Что такое #shadow-root в инспекторе HTML-страницы?

Ответ:
Задумывались ли вы о том, как устроены и стилизованы сложные браузерные элементы управления?
Например,

Браузер рисует их своими силами и по своему усмотрению. Их DOM-структура обычно нам не видна, но в инструментах разработчика можно её посмотреть. К примеру, в Chrome для этого нужно активировать пункт «Show user agent shadow DOM».

Простыми словами:
Теневой DOM используется для инкапсуляции. Благодаря ему в компоненте есть собственное «теневое» DOM-дерево, к которому нельзя просто так обратиться из главного документа, у него могут быть изолированные CSS-правила и т.д.

Пример:
Как это выглядит в браузере (фото)

Примечание:
То, что находится под #shadow-root – и называется «shadow DOM» (теневой DOM).

Web Interview Открыть/Комментировать

2021-09-17 15:30:33 #middle
#js
#вопрос

Вопрос:
Для чего используется метод call?

Ответ:
Call используется для привязки определенного объекта к значению this вызываемой функции. Единственное отличие данного метода от apply - это передача параметров через запятую, а не через массив.

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

Пример:
const obj = {
   message: 'Вызван call!'
}
function getMessage() {
   return this.message
}
getMessage.call(obj) // Вызван call!

Примечание:
• В отличии от метода bind, при вызове у функции метода call, она будет вызвана сразу же.
• Аргументы в call передаются через запятую
getMessage.call(obj, arg1, arg2)

Web Interview Открыть/Комментировать

2021-09-16 16:30:56 #junior
#js
#вопрос

Вопрос:
Как бы Вы реализовали метод map?

Ответ:
// создадим тестовый массив
const arr = ['el1', 'el2'];

// перезапишем метод map у глобального объекта Array на нашу функцию map
Array.prototype.map = function(callback) {
 // присвоим в arr массив, на котором вызывается наш метод map
 const arr = this;
 // проверяем переданные параметры
 if (!Array.isArray(arr) || !arr.length || typeof callback !== 'function') {
   return []
 } else {
   let result = []
   // мы создаем массив с результатами при каждом вызове функции
   // поскольку мы не хотим менять оригинальный массив
   for (let i = 0, len = arr.length; i < len; i++) {
     result.push(callback(arr[i], i, arr))
     // помещаем результаты сallback в result
   }
   return result
 }
}

// проверяем работоспособность нашего метода map
const newArr = arr.map((el) => {
 return el;
});
console.log(newArr); //['el1', 'el2'];

Этот пример на CodePen

Web Interview Открыть/Комментировать

2021-09-15 10:02:57 #junior
#js
#вопрос

Вопрос:
Что такое функции высшего порядка?

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

Пример:
function higherOrderFunction(param, callback) {
return callback(param);
};

Примечания:
• Так же вы могли слышать о ней, как о "Higher Order Function".

Web Interview Открыть/Комментировать

2021-09-14 12:30:36 #middle
#js
#вопрос

Вопрос:
Для чего используется метод apply?

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

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

Пример:
const obj = {
message: 'Вызван apply!'
}
function getMessage() {
return this.message
}
getMessage.apply(obj) // Вызван apply!

Примечание:
• В отличии от метода bind, при вызове у функции метода apply, она будет вызвана сразу же.
• Аргументы в apply передаются в виде массива
getMessage.apply(obj, [arg1, arg2])

Web Interview Открыть/Комментировать