35 вопросов с собеседования JavaScript-разработчика

[dopusteam]

Проверить значение переменной на соответствие NaN можно, воспользовавшись встроенным методом isNaN() или используя оператор тройного равенства ===

Оператор строгого равенства (а не тройного), не сработает. NaN === NaN вернёт false.

Можно использовать оператор остатка ....

Это не оператор остатка

В чем разница между undefined и is not defined

В чем разница между null, undefined и undeclared

Серьёзный вопрос

Для этого можно использовать встроенный метод isArray()

Встроенный метод чего? Как его вызвать?

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

Покажите пример использование переменной до её объявления

Array.prototype.forEach - это инструмент обхода цикла процедурно, а Array.prototype.map - функционально.

Можно подробнее?

[WalkInWay]

Не смотря на то, что многие вопросы в стать е действительно спорные. Но я могу ответить на часть поставленных вами.

Оператор строгого равенства (а не тройного), не сработает. NaN === NaN вернёт false.

Благодаря этому мы и определим :)

function myIsNaN(value) {
    // Тут используем строгое равенство :) 
    return (value === value) === false;
}

Покажите пример использование переменной до её объявления

Так можно делать с var (но не нужно!) и с функциями.

myFunc();

function myFunc() {
    x = 5
    console.log(x);
    var x = 2
}

[dopusteam]

В оригинале

The main difference is that map returns a new array while forEach doesn’t.

Also, map doesn’t mutate the original array instead makes a new modified/updated copy.

I would always pick map because it does allow method chaining

Перевод

Array.prototype.forEach - это инструмент обхода цикла процедурно, а Array.prototype.map - функционально.

.forEach просто проходится по массиву с выполнением переданного обратного вызова на каждой итерации, а .map создает и возвращает новый массив на основе исходного, выкладывая по кирпичику на каждой итерации.

¯\_(ツ)_/¯ 

[Sadler]

map doesn’t mutate the original array

В общем случае это неверно, так что даже хорошо, что этого нет в переводе. map имеет доступ к элементам оригинального массива и может спокойно их мутировать. Это антипаттерн, но язык формально позволяет.

[Metotron0]

У меня нет опыта прохождения собеседований, поэтому спрошу: это вопросы, которые задаются условному react-разрботчику между вопросами про фреймворк/библиотеку, чтобы понять, что человек знает не только react, но и сам язык? Или где-то есть собеседования, где ищут разработчиков на голом JS и спрашивают только вот такое? Мне кажется, это довольно простые вопросы, и если верно второе предположение, то это странная разработка, в которой задачи достаточно простые (не разработка своего убийцы ангуляра), но не захотели брать фреймворк, а зачем-то решили писать без всего, что, скорее всего, приведёт к созданию собственного подобия фреймворка или библиотеки.

[Cobalt]

Скорее всего эти вопросы для отсеивания тех условных react-разработчиков, которые начали свой путь в разработке сразу с условного react и умеют только "формочки верстать"

[Mu57Di3]

Я спрашиваю пдобные вопросы на собеседовании. Процентов 70 не могут вообще или затрудняются на них ответить. Если не отвечают на эти к вопросам по React я даже не перехожу.

[enkryptor]

Вот мой .push() в список фактических ошибок в вопросах. Точнее, в данном случае ошибка в ответе:

В JavaScript это поведение называется приведением типов. Если хотя бы один из операндов является строкой, второй также будет преобразован в строку.

Совсем наоборот, операнды арифметических выражений в JS как раз приводятся к числу. Можете проверить сами:

"3" - 2 // 1
3 * "2" // 6
"2" ** "3" // 8

Исключением является оператор +. Он используется как для сложения, так и для конкатенации строк. Если хотя бы один операнд не является числом, операция интерпретируется как конкатенация и оба значения приводятся к строке:

1 + {} // "1[object Object]"

Как видите, при этом совсем не обязательно, чтобы "один из операндов являлся строкой".

В целом вопросы неплохие, на собеседованиях вполне можно несколько таких задать. Некоторые правда очень зависят от контекста, например тот же "В чем разница между атрибутами и свойствами". Но может это и к лучшему и исправлять ничего не надо — хороший разработчик обязательно уточнит, а плохой начнёт угадывать.

[SeokkySss]

Если хотя бы один операнд не является числом, операция интерпретируется как конкатенация и оба значения приводятся к строке

Тут ни один операнд не является числом, но операция не интерпретируется как конкатенация, значения не приводятся к строке

console.log(true + false) // 1

[OlegPatron92]

В чем разница между ES6 class и ES5 function constructor?

Классы, добавленные в стандарте EcmaScript 6, всего лишь синтаксический сахар поверх всем известных прототипов.

На Хабре вроде была статья, что ES6 не просто синтаксический сахар ^_^

PS Мне скоро 30 и совсем недавно я начал замечать, что собеседующие 25 и младше задают именно такие вопросы, а 35 и выше, совсем другие. Например, в двух словах рассказать, как построить архитектуру приложения для решения заданой задачи.

[savostin]

Просто мало джунов после 35

[Metotron0]

Но тут речь про собеседующих, а не тех, кто устраивается джуном.

[demimurych]

Что такое SPA и как сделать его SEO-friendly?

И когда это вдруг SPA перестало быть SEO-friendly? Наверное тогда, когда кто-то решил что SPA это обязательно client-side rendering.

Удивительно что люди не знают о том, что первые SPA делались даже в ИЕ6, то есть где то в 2002 году. А полностью полноценными они стали с появлением возможности изменять state в History APi. Кажется в 2010 году. 

 

Объясните разницу между изменяемыми и неизменяемыми значениями

Значения примитивных типов (например, строка или число) не могут быть изменены после того, как попали в память.

В JavaScript нет примитивных типов и никогда не было. Глава 6 ECMA Spec.

 Всегда было любопытно, откуда возник этот странный миф о примитивных и ссылочных типах, и почему он до сих пор занимает чуть ли не первое место в умах JS разработчиков. 

Возможно потому, что никто из них не любит читать спецификацию языка, на котором пишет.

 

Значения объектных типов (объекты, массивы) могут изменяться в ходе работы программы.

Все типы в JS работают абсолютно одинаково. Никакой разницы в том, каким образом происходит работа с данными в обьекте или в строке - нет. И там и там данные имутабельны. 

 

В чем разница между let, const и var?

var объявляет переменную, которая может быть переопределена

Под словом переопределенная видимо подразумевается то, что можно опять писать var. 

Любопытно то, что на уровне bytecode ignition, конструкции типа

var a='str1';
var a='str2';
let b='str3'
b ='str4'

приведут к генерации абсолютно идентичного кода.

  221 S> 0x27c9c7b0c952 @   12 : 12 02             LdaConstant [2]
         0x27c9c7b0c954 @   14 : 26 f9             Star r2
  237 S> 0x27c9c7b0c956 @   16 : 12 03             LdaConstant [3]
         0x27c9c7b0c958 @   18 : 26 f9             Star r2
  253 S> 0x27c9c7b0c95a @   20 : 12 04             LdaConstant [4]
         0x27c9c7b0c95c @   22 : 26 f8             Star r3
  260 S> 0x27c9c7b0c95e @   24 : 12 05             LdaConstant [5]
         0x27c9c7b0c960 @   26 : 26 f8             Star r3

Иными словами, сакральное знание о переопределении бесполезно чуть более чем полностью. 

Так же любопытно, почему о бесполезном переопределении так много написано, а о том, что обязан знать каждый JS разработчик использующий let или const - то есть о TDZ ни слова.