2 года фронтенда, как бороться с интервьюером Douyin

опрос
2 года фронтенда, как бороться с интервьюером Douyin

предисловие

Дата интервью в 20 часов 7 мая.

Я отправился в интервью в крикет заранее в ожидании полчаса, Jiaxiang Ing ...

этобоксера такжебоксерконкурс. Уху, взлетай🤓🤓!!!

Самостоятельное введение

Во-первых, это введение个人信息,亮点так же как项目经历После этого этап самопрезентации интервью заканчивается.

ps: Здесь внимание интервьюера успешно привлекается к направлению оптимизации проекта с помощью его собственных слов.Через 2 минуты самопрезентации интервьюер должен был закончить чтение резюме, что расценивается как ожидание достижения своей цели.

Резюме связанные

просить: Ваш самый впечатляющий проект? Какие трудности? Как вы их решили?

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

WebPack

просить: Разница между загрузчиком и плагином?

  • LoaderДословно переводится как «загрузчик».Webpackрассматривать все файлы как модули, ноWebpackРодной только парсингJavaScriptфайл, если вы хотите упаковать другие файлы, вы будете использоватьLoader. такLoaderРоль состоит в том, чтобы позволитьWebpackИмеет возможность загружать и анализировать не-JavaScriptумение документировать;
  • PluginДословно переводится как «плагин».Pluginможет быть продленWebpackфункция, пустьWebpackГибкость. существуетWebpackЖизненный цикл ⽣ при работе с полной шириной будет транслировать множество событий,PluginВы можете слушать эти события и проходить их в нужное времяWebpackПредоставленный API изменяет результат вывода.

ps: После этого я последовал этому вопросу и совместил проект с разговором минут на 10. Интервью началось достаточно хорошо.

просить: Какова роль бандла, чанка и модуля в WebPack?

  • bundleКWebpackупакованные файлы;
  • chunkБлок кода, фрагмент, состоящий из нескольких модулей, используемых для слияния и разделения кода;
  • moduleпредставляет собой единый модуль, находящийся в разработке, вWebpackОдин модуль соответствует одному файлу,Webpackбудет настроен изentryНачните рекурсивно, чтобы найти все зависимые модули.

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

просить: Меньше конверсионного процесса Css

отвечатьМодуль :less переводит файлы LESS в файлы Css через Less-Loader в Webpack.

Меньше конверсии Ссылка на официальный принцип Css

1620891948(1).jpg

ps: После того, как я закончил говорить, мой разум был пуст. Я потерял свою жизнь на этом вопросе. Это почти 17 минут. Пришло время для следующего этапа.

WebpackРезюме: здесьWebpackНекоторая подготовка еще есть, но ее очень недостаточно, т.к.WebpackЯ говорил об этом около 17 минут, так что в то время я чувствовал себя нормально, но текстовое описание, казалось, в одностороннем порядке искало оскорбления.

рукописные вопросы

Реализуйте функцию isInViewport(dom), чтобы определить, находится ли элемент DOM внутри области просмотра.

function isInViewport(dom){
    let viewPortHeight = window.innerHeight || document.documentElement.clientHeight 
    let viewPortWidth = window.innerWidth ||  document.documentElement.clientWidth
    let {
        top,left,right,bottom
    } = dom.getBoundingClientRect()
    
    return (
        top >= 0 &&
        left >= 0 &&
        bottom <= viewPortHeight &&
        right <= viewPortWidth
    );
    //这里还没写完面试官就让我停下了,哼~ 高手之间意念都是相同的。
}

ps: Пишу не в первый раз.Ширина не учитывалась, когда писала первый раз.После того как интервьюер напомнил мне, я оптимизировал его таким образом.

Роль getBoundingClientRect()

Используется для получения набора позиций элемента относительно области просмотра. В коллекции есть такие свойства, как верх, право, низ, лево.

Рукописное резюме: Вот так? Ну? Вот так? С помощью простого руководства позвольте интервьюеру спросить то, что я хочу, чтобы он спросил, как от меня ожидают.

Модули ES6 и CommonJS

Разница между модулями COMMONJS и ES6

  • CommonJS — это мелкая копия модуля, ES6 Module — это ссылка на модуль, то есть ES6 Module хранит только read-only, и его значение нельзя изменить, то есть нельзя изменить указатель, аналогично const;
  • Интерфейс импорта доступен только для чтения (состояние только для чтения), и его значение переменной не может быть изменено. То есть указатель его переменной изменить нельзя, но можно изменить внутренний указатель переменной, а пару commonJS можно переназначить (изменить на указатель), но присваивание модулю ES6 скомпилирует ошибку.

ps: Здесь я отвечаю нерешительно, потому что не знаю.В то время Meituan пропустил этот вопрос в интервью и пришел снова.

Подскажите что будет на выходе?Объясните вопрос

// a.js
var a = 1;
setTimeout(() => {
    a = 2;
}, 2)

module.exports.a = a;


// main.js
const a = require('./a').a;

console.log(a);

setTimeout(() => {
    const b = require('./a').a;
    console.log(b);
}, 100);

Ответ: 1, 2 сказал много колеблясь и колеблясь.Это должно быть неправильно, и он потерял свой импульс. Реальный ответ показан на картинке

1620888695(1).jpg

ps: На картинке реальный ответ, принцип правильный, но я его вообще не понимаю.теория кратера, я ТМ вообще не готовила этот вопрос 😂😂😂, блять!!

弹坑理论

проблема алгоритма

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

задний план:

  • Предположим, мы берем число x и делаем одно из следующих действий:
  • воляxПоделить на3(если можно3Удалить)
  • б: будетxумножить на2
  • После каждой операции отмечайте результат. Если вы начнете с 9, вы можете получить последовательность

Пример:

输入: "[4,8,6,3,12,9]"
输出: [9,3,6,12,4,8]
解释: [9,3,6,12,4,8] => 9/3=3 -> 3*2=6 -> 6*2=12 -> 12/3=4 -> 4*2=8

输入: "[3000,9000]"
输出: [9000,3000]

输入: "[4,2]"
输出: [2,4]

输入: "[4,6,2]"
输出: [6,2,4] 

ps: Честно говоря, когда интервьюер задал вопрос, мое сердце трепетало так:Этот вопрос должен быть выигран, когда мой LeetCode был написан напрасно? Я не верю, что вы можете победить меня. После того, как интервьюер закончил печатать вопросы, я был ошеломлен и не понял, что я прочитал. Внезапно я понял, что значит быть молодым и энергичным , а я опух. , я плыву, я тупой.

После интервью я обратился за помощью к некоему байт-боссу (Фэншэнь) Он дал ответ После того, как я прочитал его, гм~неровный~~

微信图片_20210513150144.jpg

число с плавающей запятой

Почему появляется 0,1+0,2 != 0,3

Компьютеры хранят данные в двоичном формате, поэтому, когда компьютер вычисляет 0,1+0,2, это на самом деле двоичная сумма двух вычисленных чисел.

Что такое 0,1 в двоичном формате, что такое 0,2 в двоичном формате

Что-что??.

Функция преобразования десятичного числа в двоичное

var num = 100;
console.log(num.toString(2));

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

Принцип браузера

что такое кросс домен

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

Решение

  1. JSONP
  2. postMessage()
  3. websocket
  4. Прокси промежуточного программного обеспечения узла
  5. cors
  6. обратный прокси nginx
  7. window.name + iframe
  8. location.hash + iframe
  9. document.domain + iframe

Преимущества и недостатки

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

ps: Жаль, каждый раз почти думаю, что могу говорить бесконечно, всегда будут какие-то проблемы, с которыми я не сталкивался, или глубины знаний не хватает.

процессы и потоки

Процесс — это наименьшая единица распределения ресурсов, а поток — наименьшая единица планирования ЦП.

ps: Такой абстрактный ответ неудовлетворителен, в том числе и я, я пытался направить интервьюера на ответы на вопросы в рамках моей соответствующей системы знаний, но, к сожалению, интервьюер попросил меня рассказать об этом еще раз, мне нечего дальше отвечать, как будто А истощенный человек.

Суммировать

В конце интервью, начиная с вопросов по алгоритму, я постепенно из боксера превратился в мешка с песком, и понял, что отличий больше, чем технических. Впрочем, мне все равно, эй-эй, такое собеседование, если ты его пройдешь, ты заработаешь деньги, а я не теряю деньги. Жаль, что отдел Byte Douyin не смог получить такой потенциальный запас, как я, за последние шесть месяцев. Извините за Имин. Извините за байты.

91ef76c6a7efce1b9d160f812d1ae4deb48f8c54cf6e.jpg