Рубрики
Без рубрики

🎯 JS Service Checeplist – Часть 1 (Основы)

Обновление: я рекомендую проверять V2 здесь: … Теги с JavaScript, WebDev, CodeNewie, начинающими.

Обновление: Рекомендую проверить V2 здесь: https://www.freecodecamp.org/news/javascript-interview-prep-cheatsheet/

Подготовка к следующему интервью ❓ У меня есть идеальный контрольный список для вас. Пройти через это, и вы готовы к роску 💃

📝пререфицирует

  • Основные знания о том, как работает веб
  • Знаком с HTML/CSS, JS (особенно синтаксис ES6 +)

🧰 Методы массива

Чаще всего считается: карта , фильтр , Найти , Уменьшить , для каждого

❓ Примеры использования, решают проблему

// Return the words with more than 6 letters
const words = ['react', 'script', 'interview', 'style', 'javascript']

const ans = words.filter((word) => word.length > 6)

console.log(ans) // ['interview', 'javascript']

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

Комментировать ваши решения⬇️

Вообще, следующее до этого: Можете ли вы сделать это без метода массива?

let newArr = []

for (let i = 0; i < words.length; i++) {
  if (words[i].length > 6) {
    newArr.push(words[i])
  }
}
console.log(newArr)

❓ Разница между картой и Foreach

  • карта Возвращает новый массив, Foreach нет
// Return a new array where even numbers are multiplied by 2 
let arr = [1, 2, 3, 4, 5, 6, 7]

function consoleEven(arr) {
  let data = arr.map((num) => (num % 2 === 0 ? num * 2 : num * 1))
  console.log(data)  // [1,  4, 3, 8, 5, 12, 7]
}
consoleEven(arr) 

function consoleEven(arr) {
  let data = arr.forEach((num) => (num % 2 === 0 ? num * 2 : num * 1))
  console.log(data) // undefined
}
consoleEven(arr)
  • Способ Chaining можно сделать в карта Но не для каждого
// we are converting the new array back to original
function consoleEven(arr) {
  let data = arr
    .map((num) => (num % 2 === 0 ? num * 2 : num * 1))
    .map((item) => (item % 2 === 0 ? item / 2 : item / 1))
  console.log(data)
}

consoleEven(arr)

Примечание: карта и Foreach Не мутируйте оригинальный массив

❓ полифилл карты

Это продвинутая концепция. Мы охватим это в части-2

✔️ var, пусть и const

❓ Разница между прицелом

❓ вывод

var a = 3
var a = 4
let b = 3
let b = 4
const c = 3
const c = 4

console.log(a) // 4
console.log(b) // Syntax Error
console.log(c) // Syntax Error

Примечание: Хорошая идея, чтобы узнать различные типы ошибок

🚩 поднял

Поведение JavaScript по умолчанию для перемещения объявлений к вершине.

Функция и var декларации поднимаются

Примечание: var Декларация поднимается – не ценность

❓ Вывод/объяснить ошибку

function consoleNum() {
  console.log(num)
  var num = 10
}

consoleNum() // undefined

// Why? Also, why undefined & not error

// This is how runtime sees this
{
  var num
  console.log(num)
  num = 9
}

✔️ ==. =

== преобразует операнд в тот же тип, а затем сравнивает их

=== изображает строгую проверку равенства. Это проверяет тот же тип и тот же контент

❓ вывод

let a = null
let b

console.log(a == b) // true
console.log(a === b) // false

// why?

console.log(typeof a) // object
console.log(typeof b) // undefined

Примечание: Всегда хорошая практика, чтобы объяснить ваши ответы.

✔️ это

Объяснить это правильно потребуется другой статьи. Здесь я просто перечислю несколько ключевых вещей.

Это относится к объект что функция принадлежит, в более простых терминах, указывает на владелец вызова функции (слева от точки)

Его значение зависит от того, как он вызывается.

❓ неявный против явного привязки

Неявное привязку когда вы вызываете функцию в объекте, используя точечную обозначение.

function myFunc() {
    console.log(this)     
  }

const obj = {
  bool: true,
  myFunc: myFunc,
}

Явная связывание когда вы заставляете функцию использовать определенный объект как его Это Отказ

Способы сделать это:

❓ вывод

const myData = {
  name: 'Rajat',
  city: 'Delhi',
  displayStay: function () {
    console.log(this.name, 'stays in', this.city)
  },
}
myData.displayStay()

// create an object yourData and try to use displayStay
const yourData = {
 name: 'name',
 city: 'city'
}

// answer
myData.displayStay.call(yourData)

Примечание: Для функции стрелки это зависит от лексической области, то есть внешняя функция, в которой объявлена функция стрелки.

✔️ async и отложить

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

❓ разница между

🏢 спросил большие корпорации, такие как Amazon, Walmart и Flipkart

Лучше всего объяснено с помощью картинок:

Если есть несколько скриптов, которые зависят друг от друга, используйте отложить Отказ Отложить сценарий выполняется в порядке, который они определены.

Если вы хотите загрузить внешний скрипт, который не зависит от выполнения любых других скриптов, используйте async Отказ

Примечание: Атрибут Async не гарантирует порядок выполнения скриптов.

💾 Местное и сеансное хранение

❓ разница между

LocalStorage: Данные сохраняются даже после закрытия вашей сессии

SessionStorage: Данные теряются, когда ваша сессия закончилась, то есть на закрытии браузера на вкладке

// save
localStorage.setItem('key', 'value')
// get saved data
let data = localStorage.getItem('key')
// remove saved data
localStorage.removeItem('key')
// Same for sessionStorage

⏱️ Таймеры – Settimeout, SetInterval, ClearInterval

Setimeate () Метод вызывает функцию или оценивает выражение после указанного количества миллисекунд.

SetInterval () делает то же самое для указанных интервалов.

Наконец, ClearInterval () используется для остановки таймера.

❓ вывод

  console.log('Hello')
  setTimeout(() => {
    console.log('lovely')
  }, 0)
  console.log('reader')

  // output
  Hello
  reader
  lovely

Немного сложнее:

  for (var i = 1; i <= 5; i++) {
    setTimeout(function () {
      console.log(i)
    }, i * 1000)
  }

// output
6
6
6
6
6

Краткое объяснение: когда Setimeate Наступает снова на картинку, вся петля работает и ценность Я стал 6.

Теперь, скажем, мы хотим, чтобы результат быть 1 2 3 4 5, что делать?

var ➡️ позволять

Почему это будет работать? var глобально навес, но Пусть локально выделяется так для Пусть Новый Я создается для каждой итерации.

Если у вас были проблемы с решением этих выходов – не волнуйтесь. Подписаться на часть-2, где мы рассмотрим петлю событий и другие продвинутые темы.

Shoutout до 🗣️. Аканша для информативной сессии @ ROC8 Это позволило этому блоге. Проверьте ее Страница Отказ

Поделиться и комментировать, если вы нашли это полезно.

PS У меня есть некоторые больные нити 🧵🔥 на Твиттер

Оригинал: “https://dev.to/rajatetc/js-interview-checklist-part-1-basics-10k6”