Подготовка к собеседованию на Javascript — Часть 1

Подготовка к интервью на Javascript — часть 1

Привет всем, в этой серии статей мы рассмотрим некоторые обычные и важные концепции ядра JS, которые задают во время интервью. Эта серия, несомненно, так или иначе сделает вас лучшим JS-разработчиком. Пожалуйста, не забудьте подписаться, если вам понравилась эта статья, в будущем таких статей будет больше. С этого и начнем…

Неявное и явное связывание

var obj = {
  name: "wisdomBearer",
  display: function(){
    console.log(this.name);
  }
};

var obj1 = {
  name: "Random"
};

obj.display()
// implicit binding: outputs "wisdomBearer" as "this" will get implicitly binded to "obj"

obj.display.call(obj1);
// explicit binding: outputs "Random" as "this" will get expicitly binded to "obj1"

Я надеюсь, что приведенный выше пример поясняет разницу между явной и неявной привязкой в ​​JS, а также то, как с помощью метода call() мы можем реализовать явную привязку.
Но здесь есть загвоздка. , если мы используем стрелочную функцию вместо обычной функции (как использовалось выше), то this не будет указывать на obj1, а будет указывать на глобальный/оконный объект.

var obj = {
  name: "wisdomBearer",
  display: () => {
    console.log(this.name);
  }
};

obj.display();
// outputs --> undefined

Бесконечное каррирование

// below program will run for any number of arguements
function add(a){
  return function(b){
    if (b) return add(a+b);
    return a;
  }
};

console.log(add(5)(2)(3)());
// outputs --> 10
console.log(add(6)(9)());
// outputs --> 15

Объяснение: Всякий раз, когда метод add() вызывается с аргументом, он возвращает функцию, и эта функция принимает аргумент как b,теперь, если это «b» не имеет никакого значения, наша функция просто вернет «a». В противном случае он будет рекурсивно вызывать метод add() с суммой наших «a» и «b» (передаются первые два аргумента). Пожалуйста, прокомментируйте, если у вас все еще есть проблемы с пониманием, обязательно постараюсь объяснить более подробно.

Затенение

function test() {
  let a = "hello";
  
  if(true){
    let a = "hi";
    console.log(a);
    // O/P: hi
  }
  console.log(a);
  // O/P: hello
}

Затенение — обычное поведение, возникающее при работе с переменными let. «var» также выполняет затенение, но скорее постоянное затенение (как показано ниже), а не временное, как это делает «let» (как показано выше).

function test() {
  var a = "hello";
  if(true){
    var a = "hi";
    console.log(a);
    // O/P: hi
  }
  console.log(a);
  // O/P: hi
}

Кроме того, важно иметь в виду, что мы можем скрыть «var» с помощью «let», но обратное невозможно.

function test() {
  var a = "hello";
  let b = "hello";
  if(true){
    let a = "hi";
    console.log(a);
    // outputs: "hi"
    var b = "hi";
    // ERROR: 'b' has already been taken
  }
}

Карта, фильтрация и уменьшение

Map() используется для создания нового массива из существующего путем применения метода к каждому элементу массива. Он может иметь 3 параметра.

const nums = [1,2,3,4];
const addThree = nums.map((num, index, nums) => {
  console.log("This is each element: ", num);
  console.log("This is each element's index: ", index);
  console.log("This is whole array: ", nums);
  return num + 3;
})
console.log(addThree);
// outputs: [4,5,6,7]

Filter() используется для создания нового массива из существующего с помощью условия для каждого элемента массива, если оно истинно, то возвращает только этот конкретный элемент в новом массиве.

const nums = [1,2,3,4];
const moreThanTwo = nums.filter((num, index, nums) => {
  console.log("This is each element: ", num);
  console.log("This is each element's index: ", index);
  console.log("This is whole array: ", nums);
  return num > 2;
});
console.log(moreThanTwo);
// outputs: [3,4]

Reduce() используется для уменьшения значений массива до одного значения.

const nums = [1,2,3,4];
const sum = nums.reduce((accumulator, num) => {
  console.log("This is result after each iteration(starting from 0): ", num);
  return accumulator + num;
}, 0)

Заключение

Это подводит нас к концу части 1 этой статьи. Надеюсь, вы узнали/пересмотрели некоторые ценные концепции JS. Вскоре будет доступна часть 2, в которой также будет создаваться полифилл для вышеуказанных методов. Пожалуйста, не забудьте поставить CLAP, если вам понравилась статья. Ваши ценные предложения всегда приветствуются.
Приятного обучения!!!