Новинки 2020 года: 100 предварительных вопросов для интервью с ответами (часть 1)

внешний интерфейс опрос

В интернете очень много вопросов для собеседования, и вопросы смешанные.С одной стороны, большинство вопросов некачественные, а с другой стороны, очень мало ответов.Даже если вы получите вопросы интервью , это вам мало поможет.

Недавно я провел некоторое время, разбираясь с вопросами о фронтенд-интервью интернет-компаний первого и второго уровня в 2020 году, включая JavaScript, алгоритмы, сеть и безопасность, Vue, React и другие знания о фронтенде и связанные вопросы интервью. Ответы и анализ так же организованы в тексте.Оформить не просто.Пожалуйста дайте звезду прошедшим мимо силачам.Было бы лучше,если бы вы могли смотреть вилку звезды три раза подряд,спасибо😄 🙏

Поскольку места слишком много, эта статья включает первые статьи 50, а последние статьи 50 будут обновлены в следующей статье Добро пожаловать на внимание.

1. Напишите mySetInterVal(fn, a, b) для каждого временного интервала a, a+b, a+2b, затем напишите myClear, чтобы остановить вышеуказанный mySetInterVal

Компания: Тутиао

Категория: JavaScript

Ответы и анализ


2. Объединить двумерные упорядоченные числа, чтобы сформировать одномерный упорядоченный массив, идея слияния и сортировки

Компания: Тутиао

Категория: Алгоритмы

Ответы и анализ


3. Последовательность Фибоначчи

Компания: Tencent, CVTE, Microsoft

Категория: Алгоритмы

Ответы и анализ


4. Самая длинная неповторяющаяся длина строки

Компания: Тенсент

Категория: Алгоритмы

Ответы и анализ


5. Внедрить несколько версий браузера хром

Компания: Диди

Категория: Сеть и безопасность

Ответы и анализ


6. Какие детали можно оптимизировать в проекте React? Какие оптимизации производительности были сделаны в фактической разработке

Компании: Didi, Head One-to-One, NetEase, Youzan, Hujiang, Himalaya, Kujiale, Kuaishou

Категория: Реагировать

Ответы и анализ


7. Какие проблемы решила последняя версия React и что было добавлено?

Компания: Диди

Категория: Реагировать

Ответы и анализ


8. Расскажите про стратегию Http кэширования, в чем разница, и какие проблемы соответственно решаются

Компании: Didi, Toutiao, NetEase, Yiche, Maimai, One-to-One, Hupu, Wacai, Aifaner

Категория: Сеть и безопасность

Ответы и анализ


9. Познакомить с принципом, отличием и применением антитряски и дросселирования и реализовать их с помощью JavaScript.

Компания: Didi, Hupu, Wacai, 58, Toutiao

Рубрика: JavaScript, вопросы по программированию

Ответы и анализ


10. Фронтальная безопасность, атака «человек посередине»

Компания: Диди

Категория: Сеть и безопасность

Ответы и анализ


11. Представления о замыканиях, зачем использовать замыкания? Рассказываем о принципе закрытия и сценариях применения

Компании: Didi, Ctrip, Himalaya, WeDoctor, Mogujie, Kujiale, Tencent App, Anjuke.

Категория: JavaScript

Ответы и анализ


12. Разница между псевдоклассами css и псевдоэлементами

Компания: Диди

Категория: CSS

Ответы и анализ


13. Есть куча целых чисел, разделите их на три части, убедитесь, что сумма каждой части максимально равна (11, 42, 23, 4, 5, 6 4 5 6 11 23 42 56 78 90 )

Компания: Диди

Категория: Алгоритмы

Ответы и анализ


14. Реализовать _.get из lodash

Компания: Диди

Категория: JavaScript

Ответы и анализ


15. Реализовать добавление (1) (2) (3)

Компания: Диди

Категория: JavaScript

Ответы и анализ


16. Реализуйте связанные вызовы

Компания: Диди

Категория: JavaScript

Ответы и анализ


17. Принцип связывания событий React

Компания: Диди, Хуцзян

Категория: Реагировать

Ответы и анализ


18. Разница между массивом классов и массивом, как преобразовать массив классов dom в массив

Компания: Хиквижн

Категория: JavaScript

Ответы и анализ


19. Какие оптимизации сделал webpack с точки зрения эффективности разработки, стратегии упаковки и т. д.

Компания: Didi, Kuaishou, Master One-on-One, Gaosi Education

Категория: Инжиниринг

Ответы и анализ


20. Расскажите о механизме цикла событий (узел, браузер)

Компания: Диди, Банью, Гаоде, Зиру, Хупу, 58

Категория: Узел, JavaScript

Ответы и анализ


21. Как инкапсулировать промежуточное ПО узла

Компания: Диди, Куго

Категория: узел

Ответы и анализ


22. Как средний уровень узла выполняет переадресацию запросов слиянием

Компания: Изи Кар

Категория: узел

Ответы и анализ


23. Расскажите о характеристиках, преимуществах и недостатках промиса, о том, как его реализовать внутри и реализовать промис вручную.

Компании: Didi, Toutiao, Himalaya, Duiba, Secoo, Percentage, 58, Anjuke

Рубрика: JavaScript, вопросы по программированию

Ответы и анализ


24. Реализовать Promise.all

Promise.all = function (arr) {
  // 实现代码
};

Компания: Didi, Toutiao, Youzan, WeDoctor

Рубрика: JavaScript, вопросы по программированию

Ответы и анализ


25. Способ связи компонента React

Компания: Didi, Head One-to-One, Himalaya, Mogujie

Категория: Реагировать

Ответы и анализ


26. Сравнение redux-saga и mobx

Компания: один на один с руководителем

Категория: Реагировать

Ответы и анализ


27. Расскажите о реактивном волокне

Компании: Toutiao, Didi, Cainiao Network, Wacai, Himalaya.

Категория: Реагировать

Ответы и анализ


28. Публикация от руки Подписка

Компания: Диди, Тутиао

Категория: JavaScript

Ответы и анализ


29. Рукописный массив в дерево

Компания: Диди

Категория: JavaScript

Ответы и анализ


30. Как получить доступ к arr[-1] с помощью ES6proxy от руки

Компания: Диди

Категория: JavaScript

Ответы и анализ


31. Пожалуйста, напишите результат выполнения следующего кода

console.log(1);
setTimeout(() => {
  console.log(2);
  process.nextTick(() => {
    console.log(3);
  });
  new Promise((resolve) => {
    console.log(4);
    resolve();
  }).then(() => {
    console.log(5);
  });
});
new Promise((resolve) => {
  console.log(7);
  resolve();
}).then(() => {
  console.log(8);
});
process.nextTick(() => {
  console.log(6);
});
setTimeout(() => {
  console.log(9);
  process.nextTick(() => {
    console.log(10);
  });
  new Promise((resolve) => {
    console.log(11);
    resolve();
  }).then(() => {
    console.log(12);
  });
});

Категория: JavaScript

Ответы и анализ


32. Запишите результат выполнения

function side(arr) {
  arr[0] = arr[2];
}
function a(a, b, c = 3) {
  c = 10;
  side(arguments);
  return a + b + c;
}
a(1, 1, 1);

Категория: JavaScript

Ответы и анализ


33. Запишите результат выполнения

var min = Math.min();
max = Math.max();
console.log(min < max);

Категория: JavaScript

Ответы и анализ


34. Напишите результат выполнения и объясните причину

var a = 1;
(function a () {
    a = 2;
    console.log(a);
})();

Категория: JavaScript

Ответы и анализ


35. Напишите результат выполнения и объясните причину

var a = [0];
if (a) {
  console.log(a == true);
} else {
  console.log(a);
}

Категория: JavaScript

Ответы и анализ


36. Напишите результат выполнения и объясните причину

(function () {
  var a = (b = 5);
})();

console.log(b);
console.log(a);

Категория: JavaScript

Ответы и анализ


37. Напишите результат выполнения и объясните причину

var fullname = 'a';
var obj = {
   fullname: 'b',
   prop: {
      fullname: 'c',
      getFullname: function() {
         return this.fullname;
      }
   }
};
 
console.log(obj.prop.getFullname()); // c
var test = obj.prop.getFullname;
console.log(test());  // a

Категория: JavaScript

Ответы и анализ


38. Напишите результат выполнения и объясните причину

var company = {
    address: 'beijing'
}
var yideng = Object.create(company);
delete yideng.address
console.log(yideng.address);

Категория: JavaScript

Ответы и анализ


39. Напишите результат выполнения и объясните причину

var foo = function bar(){ return 12; };
console.log(typeof bar());  

Категория: JavaScript

Ответы и анализ


40. Напишите результат выполнения и объясните причину

var x=1;
if(function f(){}){
    x += typeof f;
}
console.log(x)

Категория: JavaScript

Ответы и анализ


41. Напишите результат выполнения и объясните причину

function f(){
      return f;
 }
console.log(new f() instanceof f);

Категория: JavaScript

Ответы и анализ


42. Напишите результат выполнения и объясните причину

var foo = {
        bar: function(){
            return this.baz;
        },
         baz:1
    }
console.log(typeof (f=foo.bar)());

Категория: JavaScript

Ответы и анализ


43. Расскажите о проблемах и причинах, на которые нужно обратить внимание React Hooks в обычной разработке?

Ответы и анализ


44. Есть ли у параметра name в компоненте Vue другие функции, помимо поддержания активности? Можете ли вы рассказать о том, что вы знаете о Keep-alive? (обычное использование и реализация исходного кода)

Категория: Вью

Ответы и анализ

45. Почему Vue использует vm.$set() для решения проблемы, когда новые свойства объектов не могут отвечать? Не могли бы вы рассказать мне, как работает следующий код?

Vue.set (object, propertyName, value) 
vm.$set (object, propertyName, value)

Категория: Вью

Ответы и анализ


46. ​​Поскольку Vue может точно обнаруживать изменения данных в конкретном DOM посредством перехвата данных, зачем нужен виртуальный DOM diff?

Категория: Вью

Ответы и анализ


47. Какое утверждение о преимуществах и недостатках виртуального DOM Vue.js верно? (большой выбор)

A. Он может гарантировать нижний предел производительности, который намного лучше, чем грубая производительность операции DOM, поэтому виртуальный DOM фреймворка может по крайней мере гарантировать, что он все еще может обеспечить хорошую производительность без ручной оптимизации, то есть нижний предел гарантированной производительности; B. Нет необходимости вручную манипулировать DOM, нет необходимости вручную манипулировать DOM, просто напишите логику кода View-Model, фреймворк будет двунаправленно связывать виртуальный DOM и данные, чтобы помочь нам обновить представление предсказуемым образом, значительно повышая эффективность нашего развития; C. Может быть оптимизирован до предела: виртуальный DOM + разумная оптимизация могут максимизировать производительность. D. Он может быть кросс-платформенным. Виртуальный DOM по сути является объектом JavaScript, а DOM тесно связан с платформой. В отличие от этого, виртуальный DOM может выполнять более удобные кросс-платформенные операции, такие как рендеринг сервера, разработка weex и т. д. на.

Категория: Вью

Ответы и анализ


48. Что выводит следующий код?

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 1);
}

Категория: JavaScript

Ответы и анализ


49. Напишите результат выполнения и объясните причину

const num = {
  a: 10,
  add() {
    return this.a + 2;
  },
  reduce: () => this.a -2;
};
console.log(num.add());
console.log(num.reduce());

Категория: JavaScript

Ответы и анализ


50. Напишите результат выполнения и объясните причину

const person = { name: "yideng" };

function sayHi(age) {
  return `${this.name} is ${age}`;
}
console.log(sayHi.call(person, 5));
console.log(sayHi.bind(person, 5));

Категория: JavaScript

Ответы и анализ

Артефакт очистки интерфейса

Этих вопросов недостаточно? Отсканируйте код, чтобы попасть на планету фронтенд-интервью🌍, разблокируйте артефакт для закрашивания вопросов, а также вы можете получить800+ вопросов для фронтенд-интервьюа такжеПервоочередные общие интервью на высокочастотных тестовых площадках.