Frontend Interview - собеседования по Javascript / Html / Css
10.4K subscribers
2.1K photos
118 videos
320 files
501 links
Канал для подготовки к собеседованиям по фронтенду

Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront

Купить рекламу: https://telega.in/c/frontendinterview

Канал в реестре РКН:
https://rknn.link/su
Download Telegram
​Пробелы

Напишите функцию, которая проверяет строку на правильность расставленных пробелов.
То есть между словами должен находиться пробел, а также не должно быть пробелов перед строкой и после неё.
Примеры:
'Hello world' = true
' Hello world' = false
'Hello world ' = false
'Hello world' = false
'Hello' = true
'Helloworld' = true
' ' = false
'' = true
В данной книге речь пойдет о том, как правильно изспользовать таблицы стилей при создании HTML- документа. Данная книга отлично подойдет для школьников и учеников гимназии. Так же ее будет интересно почитать тем, кто хочет расширить свои знания в HTML и CSS.
​Какие приемы работы с асинхронным кодом в JS Вы знаете?

1. Функции обратного вызова (Callbacks).
function loadScript(src, callback) {
let script = document.createElement('script');
script.src = src;
script.onload = () => callback(script);
document.head.append(script);
}
Смысл такой: вторым аргументом передаётся функция (обычно анонимная), которая выполняется по завершении действия.

2. Промисы (Promises).
const promise1 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('foo');
}, 300);
});

promise1.then((value) => {
console.log(value);
// expected output: "foo"
});
Promise представляет собой обертку для значения, неизвестного на момент создания промиса. Он позволяет обрабатывать результаты асинхронных операций так, как если бы они были синхронными: вместо конечного результата асинхронного метода возвращается обещание (промис) получить результат в некоторый момент в будущем.

3. Async/await.
 function resolveAfter2Seconds(x) {
return new Promise(resolve => {
setTimeout(() => {
resolve(x);
}, 2000);
});
}

async function add1(x) {
const a = await resolveAfter2Seconds(20);
const b = await resolveAfter2Seconds(30);
return x + a + b;
}
После вызова функция async возвращает Promise.
Функция async может содержать выражение await, которое приостанавливает выполнение функции async и ожидает ответа от переданного Promise, затем возобновляя выполнение функции async и возвращая полученное значение.
В чем разница между методами Object.freeze и Object.seal?

Object.freeze() замораживает объект: это значит, что он предотвращает добавление новых свойств к объекту, удаление старых свойств из объекта и изменение существующих свойств или значения их атрибутов перечисляемости, настраиваемости и записываемости.

Object.seal() запечатывает объект, предотвращая добавление новых свойств к объекту и делая все существующие свойства не настраиваемыми.

Разница заключается в том, что при использовании метода Object.freeze мы не можем менять или редактировать свойства объекта, а при использовании Object.seal у нас такая возможность имеется.
Разворот числа

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

Примеры:
Test.assertEquals(reverse(1234), 4321);
Test.assertEquals(reverse(10987), 78901);
Test.assertEquals(reverse(1020), 201);
Какое значение у левого нижнего border-radius элемента div?
Anonymous Quiz
57%
20px
25%
40px
10%
30px
8%
25px
Как в JS создать объект?

Объектный литерал:
const o = {
name: 'Mark',
greeting(){
return `Hi, I'm ${this.name}`
}
}

o.greeting() // Hi, I'm Mark

Функция-конструктор:
function Person(name){
this.name = name
}

Person.prototype.greeting = function(){
return `Hi, I'm ${this.name}`
}

const mark = new Person('Mark')

mark.greeting() // Hi, I'm Mark

Метод Object.create:
const n = {
greeting(){
return `Hi, I'm ${this.name}`
}
}

const o = Object.create(n)

o.name = 'Mark'

console.log(o.greeting) // Hi, I'm Mark
👍1
Какое значение примет result?
Anonymous Quiz
20%
15
9%
36
28%
10
17%
5
27%
0
Что такое AJAX?

AJAX или Asyncronous JavaScript and XML — это набор взаимосвязанных технологий, которые позволяют работать с данными в асинхронном режиме. Это означает, что мы можем отправлять данные на сервер и получать данные с него без перезагрузки веб-страницы.

AJAX использует следующие технологии:
HTML — структура веб-страницы.
CSS — стили веб-страницы.
JavaScript — поведение страницы и работа с DOM.
XMLHttpRequest API — отправка и получение данных с сервера.
PHP, Python, Nodejs — какой-нибудь серверный язык.
Какое значение у свойства padding-bottom элемента div?
Anonymous Quiz
21%
60px
3%
120px
5%
10px
19%
20px
51%
40px
Как определить наличие свойства в объекте?

Существует три способа это сделать.

Первый способ состоит в использовании оператора «in»:
const o = {
'prop': 'bwahahah',
'prop2': 'hweasa'
}

console.log('prop' in o) // true
console.log('prop1' in o) // false

Второй — использовать метод hasOwnProperty:
console.log(o.hasOwnProperty('prop2')) // true
console.log(o.hasOwnProperty('prop1')) // false

Третий — индексная нотация массива:
console.log(o['prop']) // bwahahah
console.log(o['prop1']) // undefined
JavaScript для детей

Книга подойдёт для тех, кто только начинает изучать JavaScript. Она знакомит с основами и даёт поверхностное представление о языке. В книге три части: основы, продвинутый JavaScript и графика. В ней также есть практические задания, в которых пошагово рассказывается, как написать игру.