Как определить наличие свойства в объекте?

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

Первый способ состоит в использовании оператора «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_Teacher

#test | JavaScript_Teacher

Callback-функции

Колбэк — это функция, которая должна быть выполнена после завершения выполнения другой функции. Такие функции необходимы, потому что многие действия JavaScript являются асинхронными. Это означает, что они на самом деле не останавливают выполнение программы (или функции) до тех пор, пока они не будут завершены. Данная статья поможет разобраться с колбэк-функциями.

Читать

#статья | JavaScript_Teacher

Что такое AJAX?

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

AJAX использует следующие технологии:
HTML — структура веб-страницы.
CSS — стили веб-страницы.
JavaScript — поведение страницы и работа с DOM.
XMLHttpRequest API — отправка и получение данных с сервера.
PHP, Python, Nodejs — какой-нибудь серверный язык.

#собеседование | JavaScript_Teacher

isArray

Ещё один полезный метод, на этот раз позволяющий определить, являются ли входящие данные массивом

let emojis = ['', '️', '', ''];
console.log(Array.isArray(emojis));

let obj = {};
console.log(Array.isArray(obj));

#tips | JavaScript_Teacher

Шаблонный метод

Делимся статьей, где автор рассказывает про паттерн проектирования “Шаблонный метод” в JavaScript. Подробно рассмотрен подход паттерна, приведен один сценарий, в котором необходимо использовать данный паттерн.

Читать

#статья | JavaScript_Teacher

Как в 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

#собеседование | JavaScript_Teacher

"undefined" против "null"

"undefined" – присутствует у переменной, которая была объявлена, но значение для неё задано не было
"null" – обозначает пустое или несуществующее значение, которое явно присваивается переменной

"undefined" и "null" не равны при строгом сравнивании

Дополнительно почитать на тему разницы между этими двумя значениями можно здесь

#tips | JavaScript_Teacher

Map против Set

Set — это множество данных коллекции, которое должно состоять из уникальных значений. Map — это коллекция ключ/значение. Map и Set имеют схожие методы; к ним относятся .has(), .get(), .delete() и .size(). Данная статья рассказывает, когда нужно использовать Map и Set.

Читать

#статья | JavaScript_Teacher

В чем разница между оператором «in» и методом hasOwnProperty?

Отличие состоит в том, что оператор «in» проверяет наличие свойства не только в самом объекте, но и в его прототипах, а метод hasOwnProperty — только в объекте.

console.log('prop' in o) // true
console.log('toString' in o) // true

console.log(o.hasOwnProperty('prop')) // true
console.log(o.hasOwnProperty('toString')) // false

#собеседование | JavaScript_Teacher

Несколько интересных лайфхаков

• Сравнение NaNс чем-либо (даже с NaN) всегда ложно, включая ==, < и > .

• NaN (Not-a-Number) означает “не число”, но если вы запросите тип, NaNвернет число.

• Array.sort может выполнять функцию сравнения и вызывается драйвером, подобным быстрой сортировке (зависит от реализации).

• Некоторые версии JavaScript позволяют вам получать доступ к элементам $0, $1, $2 в регулярном выражении.

• null не похож ни на что другое. Это не объект, не логическое значение, не число, не строка и не undefined. Это немного похоже на “альтернативный” undefined. (Примечание: typeof null == "object")

#tips | JavaScript_Teacher

Chrono

Chrono — это парсер даты на естественном языке в Javascript. Он предназначен для обработки большинства форматов даты/времени и извлечения информации из любого заданного текста. В данной статье автор демонстрирует внедрение русского языка в Chrono.

Читать

#статья | JavaScript_Teacher

Какие приемы работы с асинхронным кодом в JS Вы знаете?

• Функции обратного вызова (Callbacks).
• Промисы (Promises).
• Async/await.
• Библиотеки вроде async.js, blueprint, q, co.

#собеседование | JavaScript_Teacher

Несколько интересных лайфхаков

• В самом внешнем контексте this вызывает противоположный неназванный [глобальный] объект.

• Объявление переменной с помощью var вместо расчета на автоматическое объявление переменной, дает среде выполнения реальный шанс оптимизировать доступ к этой переменной.

• Конструкция with уничтожит такую оптимизацию.

• Имена переменных могут содержать символы Юникода.

• Регулярные выражения JavaScript на самом деле не являются регулярными. Они основаны на регулярных выражениях Perl. Можно создавать выражения с предварительным просмотром, для оценки которых требуется очень много времени.

#tips | JavaScript_Teacher

Редактор SVG диаграмм

DgrmJS — это библиотека JavaScript для создания блок-схем SVG. Основная цель библиотеки — настроить рабочие процессы в системах BPM (Business Process Management). Подробней об этой библиотеке узнаешь из статьи.

Читать

#статья | JavaScript_Teacher

В чем разница между обычной функцией и функциональным выражением?

Допустим, у нас есть следующее:

notHoistedFunc()

function hoistedFunc(){
    console.log('I am hoisted')
}

var notHoistedFunc = function(){
    console.log('I will not be hoisted!')
}

Вызов notHoistedFunc приведет к ошибке, а вызов hoistedFunc нет, потому что hoistedFunc «всплывает», поднимается в глобальную область видимости, а notHoistedFunc нет.

#собеседование | JavaScript_Teacher

Несколько интересных лайфхаков

• Блоки можно пометить и использовать в качестве целей break, а циклы в качестве целей continue .

• Массивы не являются разреженными. Установка 1000-го элемента в противоположном пустом массиве должна заполнить его undefined (зависит от реализации).

• if (new Boolean(false)) {...} выполнит блок {...}

• Механизмы регулярных выражений JavaScript зависят от реализации: например, можно писать “непереносимые” регулярные выражения.

#tips | JavaScript_Teacher

Трехмерная фотогалерея

В данной статьей демонстрируется создание трехмерной фотогалереи. Проект состоит из HTML-страницы, где находится карусель; CSS-файла, где настраивается внешний вид карусели в целом; скрипта на JavaScript, в котором реализована работа карусели с фотографиями.

Читать

#статья | JavaScript_Teacher

Как в JS вызвать функцию?

В JS существует 4 способа вызвать функцию. Вызов определяет значение this или «владельца» функции.

• Вызов в качестве функции. Если функция вызывается как метод, конструктор или с помощью методов apply или call, значит она вызывается как функция. Владельцем такой функции является объект window

• Вызов в качестве метода. Когда функция является свойством объекта, мы называем ее методом. Когда вызывается метод, значением this становится объект этого метода

• Вызов в качестве конструктора. Когда функция вызывается с использованием ключевого слова «new», мы называем такую функцию конструктором. При этом создается пустой объект, являющийся значением this

• Вызов с помощью методов apply или call. Мы используем эти методы, когда хотим явно определить значение this или владельца функции

#собеседование | JavaScript_Teacher