Поздняя запись интервью с интерфейсом Дачанга (вопросы интервью + частичные ответы)

опрос
Поздняя запись интервью с интерфейсом Дачанга (вопросы интервью + частичные ответы)

Мое краткое введение: я работаю на бакалавриате уже два года, и я в основном использовал vue в своей предыдущей работе (поэтому нет вопросов на собеседовании, связанных с реакцией). Следующие интервью были проведены с начала августа до середины сентября этого года и сейчас находятся на берегу. Front-end Xiaobai, пожалуйста, поправьте меня, если возникнут проблемы с написанным контентом (лук🙇‍♀️), с нетерпением ждем обсуждения и совместного роста~

Коммерциализация нецентральной области зависит от опыта

  1. Какие существуют методы передачи значений между родительским и дочерним компонентами в Vue? Расскажите подробно.

  2. Написанный вручную EventEmitter, реализация методов включения/выдачи/выключения.

  3. Отзывчивые принципы Vue.

  4. Поскольку мы только что говорили о принципе адаптивности, в следующем коде сначала foo=true, затем foo=false, а затем модифицируется a=123, будет ли страница перерисовываться?

    <template>
<div v-if=foo>
{{ a }}
</div>
<div v-else>
{{ b }}
</div>
</tempate>

  5. Знаете о предварительной проверке запроса? Разверните беседу.

  6. Вы понимаете рабочий процесс веб-пакета?

  7. Только что упомянутые плагины, теперь есть два плагина, может ли плагин1 отправлять события для прослушивания плагином2?

  8. Проблема с кодом цикла событий

    async function async1(){
  console.log('async1 start')
  await async2()
  console.log('async1 end')
}
async function async2(){
  console.log('async2')
}
console.log('script start')
setTimeout(function(){
  console.log('setTimeout') 
},0)  
requestAnimationFrame(function(){
    console.log('requestAnimationFrame') 
})
async1();
new Promise(function(resolve){
  console.log('promise1')
  resolve();
}).then(function(){
  console.log('promise2')
})

  9. Вопрос алгоритма: Найдите самую длинную подстроку, которая не содержит повторяющихся символов из строки, и рассчитайте длину самой длинной подстроки. Например, введитеabcabcbb, то самая длинная подстрока без повторяющихся символов равнаabc, длина3.

Байты

  1. Ввести https.

  2. Вы знаете, как обрабатывать http-запросы в https?

  3. Вы понимаете особенности http2?

  4. Только что упомянул, что http2 имеет возможность пуш-сервера. И http2, и websocket имеют функцию push-сервера, поэтому будет ли websocket заменен на http2? Почему?

  5. Реализуйте карту, используя метод уменьшения массива.

    Array.prototype.myMap(fn,_this) {
   let result = [];
   this.reduce((prev,cur,index,arr) => {
       result[index] = fn.call(_this,arr[index],index,arr);
   },0)
   return result;
}

//arr.map((item,index,arr) => fn(item),_this);
//arr.reduce((prev,cur,index,arr) => {},start);

  6. проблема цикла событий

    async function f1() {
    return new Promise((resolve) => {
        console.log(4)
        resolve()
    }).then(() => {
        console.log(5)
    })
}
async function run() {
    console.log(1)
    new Promise((resolve) => {
        console.log(2)
        resolve()
    }).then(() => {
        console.log(3)
    })
    await f1()
    setTimeout(() => {
        console.log(6)
    }, 0)
    console.log(7)
}
run()

  7. Учитывая двоичный массив, найдите длину самого длинного непрерывного подмассива с одинаковым количеством 0 и 1, например.[0,0,0,1,1,0,1,0,0]=>6

    //先写了个暴力
// function test(arr) {
//     let maxLen = 0;
//     for(let i=0; i<arr.length; i++) {
//         for(let j=i+1; j<arr.length; i++) {
//             let temp = arr.slice(i,j+1);
//             let count0 = 0,count1 = 0;
//             temp.forEach(item => {
//                 if(item == 0) {
//                     count0++;
//                 } else {
//                     count1++;
//                 }
//             })
//             if(count0 == count1) {
//                 maxLen = Math.max(maxLen, j - i + 1);
//             }
//         }
//     }
//     return maxLen;
// }

//前缀和
function test(arr) {
    let len = arr.length;
    let map = new Map();
    let count = 0;
    let res = 0;
    //[0] -> 0
    for(let i=0; i<len; i++) {
        count += arr[i] == 1 ? 1 : -1;
        if(map.has(count)) {
            res = Math.max(res,i-map.get(count));
        }else {
            map.set(count,i);
        }
     }
    return res;
 }
console.log(test([0, 0, 0,1, 1, 0,1, 0, 0]));

Bytes Три стороны коммерциализации в нецентральных регионах

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

  1. deepclone

  2. Сколько режимов у vue-router? Какая разница? Что нужно настроить в фоновом режиме 404 в режиме истории?

  3. Алгоритм Вопрос: Дан массив целых чиселnums, найти непрерывный подмассив с наибольшей суммой (подмассив содержит хотя бы один элемент) и вернуть его наибольшую сумму.

    var maxSubArray = function(nums) {
    // let res = nums[0];
    // let sum = 0;
    // for(let num of nums) {
    //     if(sum > 0) {
    //         sum += num;
    //     } else {
    //         sum = num;
    //     }
    //     res = Math.max(res,sum);
    // }
    // return res;
    // let res = nums[0];
    // let tep = 0;
    // nums.forEach(num => {
    //     tep = Math.max(num+tep,num);
    //     res = Math.max(res,tep);
    // })
    // return res;

    let n = nums.length;
    if(n == 0) return 0;
    let dp = new Array(n);
    dp[0] = nums[0];
    for(let i = 1; i < n; i++) {
        dp[i] = Math.max(nums[i], dp[i-1]+nums[i]);
    }
    let res = dp[0];
    for(let i = 0; i < dp.length; i++) {
        res = Math.max(res,dp[i]);
    }
    return res;
};

Шопейская еда

  1. Проблема с выводом замыкания.

  2. Напишите анти-шейк. Вы сейчас пишете не немедленную версию, можете ли вы написать немедленную версию?

  3. Вывод кода цикла обработки событий с указанием причины проблемы.

  4. Внедрить кросс-домены.

  5. Опишите предварительный запрос.

  6. Задача алгоритма: Поднять все свойства объекта на первый уровень.

function transfor(obj,stack,result) {
    for(let key in obj) {
        if(parseInt(key).toString() == 'NaN') {
            stack.push(key);
        } else {  
            stack.push(`[${key}]`);
        }
        if(typeof obj[key] == 'object' && obj[key] !== null) {
            transfor(obj[key],stack,result);
        } else {
            let stackStr = stack.join('.');
            console.log(result)
            result[stackStr] = obj[key];
            stack.pop();
        }
    }
    return result;
}

let testObj = {
    a: {
        b: 1,
        c: [0, {d: 1}]
    }
}

console.log(transfor(testObj,[],{}))

  1. Познакомить с адаптивным принципом vue

  2. a === 1 && a === 2 при каких обстоятельствах он появится

Шопейская еда

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

  1. Код Вопрос: Реализовать функцию компоновки

  2. Принцип виртуального списка. Статьи по Теме:Расскажите о длинных списках во фронтенд-разработке

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

    Ленивый рендеринг — это то, что мы обычно называем бесконечной прокруткой. Это означает загрузку оставшихся данных при прокрутке вниз страницы. Это способ совместной оптимизации передней и задней частей. экономия трафика. Интерфейс будет быстрее отображать меньше данных в первый раз, и эта оптимизация требует, чтобы сторона продукта принимала эту форму списка, иначе он не может быть оптимизирован таким образом. Идея реализации очень проста: слушайте событие прокрутки родительского элемента (обычно окна), судите, дошло ли оно до низа страницы через scrollTop родительского элемента, и дошло ли до дна страницы, загрузите больше данных. Если он будет применяться в производстве, рекомендуется использовать зрелую библиотеку классов, которую можно искать по «названию фреймворка + бесконечная прокрутка».

    Отрисовка видимой области означает, что отрисовываются только элементы списка в видимой области, а невидимая область вообще не визуализируется, а элементы списка динамически обновляются при прокрутке полосы прокрутки. Рендеринг видимой области подходит для следующих сценариев:

    • Высота формы представления всех данных должна быть постоянной (не обязательно, но необходимо определить минимальную высоту).
    • В продуктовом дизайне количество данных, которые нужно загрузить за один раз, относительно велико (более 1000), а полосу прокрутки нужно монтировать в области фиксированной высоты (это также возможно в Windows, но только этот список необходимо отображать на всей площади).

    Способ отрисовки списка в видимой области обычно называется Virtual List, то есть виртуальный список. Что такое виртуальный список? Сначала сделайте простое определение виртуального списка. Из-за высокой стоимости времени, необходимого для создания и рендеринга элементов Dom, время, необходимое для рендеринга всего списка, неприемлемо в случае больших данных. Одним из решений является рендеринг только видимой области в любом случае, что может обеспечить чрезвычайно высокую начальную производительность рендеринга. Виртуальный список относится к списку, отображаемому в видимой области. Две важные концепции:

    • Прокручиваемая область: если имеется 1000 фрагментов данных и высота каждого элемента списка равна 30, тогда высота прокручиваемой области составляет 1000*30. Когда пользователь изменяет текущее значение прокрутки полосы прокрутки списка, это приводит к изменению содержимого видимой области.
    • Видимая область: например, высота списка составляет 300, а справа есть вертикальная полоса прокрутки для прокрутки, тогда визуально видимая область — это видимая область.

    Реализация виртуального списка заключается в обработке изменения видимой области после прокрутки полосы прокрутки. Конкретные шаги заключаются в следующем:

    1. Вычислить startIndex начальных данных текущей видимой области;
    2. Вычислить endIndex конечных данных текущей видимой области;
    3. Вычислить данные текущей видимой области и отобразить их на странице;
    4. Вычислить позицию смещения startOffset данных, соответствующих startIndex во всем списке, и установить ее в списке.

    Статьи по Теме:«Передний расширенный» высокопроизводительный рендеринг 100 000 элементов данных (виртуальный список)

Сторона торговой площадки Shopee

Говорите с интервьюером очень хорошо!

  1. Добавление больших цифр (немного изменено с названия на leetcode, нужно учитывать знаковый регистр: ++/--/+-/-+)

  2. Составление реализации (Old Shopee спросил hh, и интервьюер подумал, что интервьюер изменил вопрос 1 после того, как он уже сталкивался с этим вопросом раньше)

  3. реализация шины событий

  4. js реализует разницу между поверхностной и глубокой копией.

    Статьи по Теме:Вууху.Основное 51.net/article/192…

    Неглубокая копия — это побитовая копия объекта, которая создает новый объект и по очереди копирует элементы исходного объекта. Если атрибут примитивного типа, копируется значение примитивного типа, если атрибут ссылочного типа, копируется адрес памяти. Следовательно, если член объекта в новом объекте изменит адрес, это повлияет на исходный объект.

  5. Является ли object.assign() поверхностной или глубокой копией?

    Метод Object.assign() может копировать любое количество перечислимых свойств самого исходного объекта в целевой объект, а затем возвращать целевой объект, но Object.assign() выполняет поверхностное копирование, которое копирует ссылку на свойства объекта. , а не сам объект. Этот метод работает как для массива, так и для объекта. Array.prototype.concat() и Array.prototype.slice() также являются мелкими копиями и работают только с Array.

  6. В чем недостаток JSON.parse(JSON.stringify(obj))? Будет ли сообщаться об ошибке при наличии циклической ссылки в объекте?

    JSON.parse(JSON.stringify(obj)) может реализовывать глубокие копии массивов и объектов и примитивных типов данных, но не может обрабатывать функции. Поскольку метод JSON.stringify() преобразует значение javascript в строку JSON, эта функция не может быть принята. Другие эффекты следующие:

    • Если в объекте есть объект времени, то в объекте после копирования этим методом время находится в виде строки вместо объекта времени
    • Если в объекте есть объекты RegExp и Error, сериализованный результат будет пустым.
    • Если в объекте есть функция или undefined, сериализованный результат потеряет функцию или undefined
    • Если в объекте есть NAN, бесконечность, -бесконечность, сериализованный результат станет нулевым
    • JSON.stringfy() может сериализовать только перечисляемые собственные свойства объекта.Если объект создается конструктором, конструктор объекта будет отброшен после копирования
    • Если в объекте есть циклическая ссылка и глубокая копия не может быть правильно реализована, будет сообщено об ошибке

  7. Как выполнить глубокую копию, когда в объекте есть циклическая ссылка?

    Статьи по Теме:blog.CSDN.net/WeChat_3373…

    Создайте переменную типа Map, которая существует на протяжении всего выполнения функции (Map может задавать тип, отличный от строки, в качестве ключа, который также является парной структурой ключ-значение, что является более гибким, чем объект), и этот раунд передается в при каждом выполнении функции В качестве ключа используется вновь созданный объект, а в качестве значения используется вновь созданный объект В начале функции оценивается, существует ли уже входящий объект в ключах карты , Если он существует, это означает, что входящий объект был пройден ранее.

  8. Расскажите о функциональном программировании.

    • Это стиль программирования или способ мышления, параллельный объектно-ориентированному программированию.
    • Абстрагирует детализированные функции, которые могут быть объединены в более мощные функции.
    • Функция относится не к методу в программе, а к отношению отображения в математике.
    • тот же вход, тот же выход
    • Функциональное программирование — это абстракция вычислительных процессов.

    Функциональное программирование требует, чтобы функции были чистыми и не имели побочных эффектов. Поскольку это математическая операция, исходная цель состоит в том, чтобы оценить и ничего больше не делать, иначе алгоритм функции не может быть удовлетворен. В заключение, в функциональном программировании функция — это конвейер. Введите значение на этом конце, и на другом конце появится новое значение, которое не имеет никакого другого эффекта. (Подробности см. в соответствующих статьях г-на Жуань Ифэна)

  9. Давайте поговорим о понимании и различиях между mvvm и mvc.

    Я не нашел хорошей статьи по этому вопросу (или я могу понять это глубже ==), статьи по теме:Наггетс.Талант/пост/696198…

  10. Ты знаешь https?

  11. Расскажите о механизме кэширования в http

  12. Узнать о новых возможностях http2?

  13. Вы понимаете механизм браузера с одинаковым происхождением? Поговорите о своем понимании междоменного доступа.

  14. Знаете преимущества многослойности в браузерах?

  15. Расскажите о своем понимании цепочки областей видимости, а как насчет замыканий?

  16. Говоря о цепочке прототипов, считаете ли вы, что цепочка прототипов имеет какие-то преимущества?

    Честно говоря, никакого преимущества. Свойства прототипа конструктора являются общими для всех экземпляров, созданных конструктором, то есть свойства не являются приватизированными, и изменения свойств прототипа повлияют на все экземпляры.

  17. В чем разница между стрелочными функциями и обычными функциями?

    У стрелочных функций нет собственного объекта this. - Для обычных функций внутреннее this указывает на объект, на котором выполняется функция, но это неверно для стрелочных функций. У него нет собственного объекта this, внутренний this — это this в верхней области видимости, когда он определен. Другими словами, указатель this внутри стрелочной функции является фиксированным, в отличие от указателя this обычной функции, который является переменным. Итак, есть следующие отличия:

    • Его нельзя использовать как конструктор, то есть нельзя использовать новую команду со стрелочной функцией, иначе будет выброшена ошибка. (также потому, что у него нет своего this)
    • Вы не можете использовать объект arguments, которого нет в теле функции. Если вы хотите использовать его, вы можете вместо него использовать оставшийся параметр.
    • Команду yield нельзя использовать, поэтому стрелочные функции нельзя использовать в качестве функций-генераторов.
    • Следующие три переменные также не существуют в стрелочных функциях: arguments\super\new.target
    • Поскольку у стрелочной функции нет собственного this, вы, конечно, не можете использовать call(), apply(), bind() для изменения указателя this.

  18. Каковы типы значений js? Какая разница?

    Примитивные типы/ссылочные типы. Разница заключается в способе хранения значений (стек, куча).

  19. Есть ли способ дифференцировать тип данных js?

    typeof/instanceof/construtor/isPrototypeOf/Object.getPrototypeOf()/Object.prototype.toString.call()

    Number/String/Boolean/Null/undefined/Object/symbol/bigInt

  20. Вы понимаете разницу между object.is() и ===?

    ES5 сравнивает два значения на равенство всего двумя операторами: оператором равенства (==) и оператором строгого равенства (===). Все они имеют недостатки, первый автоматически преобразует тип данных, второй NaN не равен самому себе, а +0 равен -0. В JavaScript отсутствует операция, при которой во всех контекстах, пока два значения совпадают, они должны быть равны.

    ES6 предлагает алгоритм «равенства одинаковых значений» для решения этой проблемы. Object.is — это новый способ развертывания этого алгоритма. Он используется для сравнения того, являются ли два значения строго равными, и имеет в основном то же поведение, что и оператор строгого сравнения (===). object.is() исправляет некоторые ошибки особого случая на основе строгого равенства, в частности, +0 и -0, NAN и NAN.

    if (x === y) {
    // 针对+0 不等于 -0的情况
    return x !== 0 || 1 / x === 1 / y;
  }
  // 针对NaN的情况
  return x !== x && y !== y;

  21. Каков механизм сборки мусора js?

    Ответ в основном связан с механизмом сборки мусора v8.

  22. Разница и связь между классом es6 и конструктором es5?

    По сути, класс ES6 можно рассматривать как просто синтаксический сахар, и большинство его функций может выполнять ES5.Новый метод написания класса просто делает метод написания прототипа объекта более понятным и больше похожим на синтаксис объектно-ориентированного программирования. В классе есть методstructor(), который является конструктором, а ключевое слово this представляет объект-экземпляр. С помощью typeof можно узнать, что тип данных класса является функцией, а сам класс указывает на конструктор, при его использовании новая команда также применяется непосредственно к классу, что точно так же, как и при использовании конструктора. Свойство прототипа конструктора продолжает существовать в классе es6. Фактически все методы класса определяются в свойстве прототипа. Следовательно, вызов метода экземпляра класса фактически вызывает метод прототипа. Поскольку методы класса определены в объекте-прототипе, новые методы класса могут быть добавлены в объект-прототип. Метод Object.assign() — это удобный способ одновременного добавления нескольких методов в класс. Свойство конструктора() объекта-прототипа указывает непосредственно на сам класс, что согласуется с поведением ES5. Однако все методы, определенные внутри класса, не являются перечисляемыми, что несовместимо с поведением ES5. Класс должен вызываться с new, иначе будет сообщено об ошибке, в чем отличие его от обычного конструктора, который может выполняться без new.

    Object.keys(Point.prototype)
// []
Object.getOwnPropertyNames(Point.prototype)
// ["constructor","toString"]

    Конкретные статьи:es6.ruanyifeng.com/#docs/class

  23. Каковы способы загрузки js асинхронно? Какая разница?

    defer: Выполнится момент, когда вся страница будет разобрана (построено DOM-дерево), доступно ниже ie9, и код js может быть написан внутри

    async: Скрипт будет выполнен после загрузки.Можно использовать для ie9 и выше.Загружать можно только внешние скрипты, а в теге script нельзя писать js.

    Вышеуказанные два не могут быть записаны в одном и том же теге.

    Если вы хотите добиться совместимости с браузером, вы можете использовать событие скрипта onreadystatechange для отслеживания состояния готовности скрипта (загрузка/завершение/загрузка). установить функцию обратного вызова.

  24. Вы понимаете модель обработки событий? Каков их порядок?

    Модель обработки событий включает в себя захват событий и всплытие событий. Элементы со структурной (невизуальной) вложенной связью будут иметь функцию захвата событий и всплытия событий, то есть одно и то же событие будет всплывать от дочернего элемента к родительскому элементу, от родительского элемента к дочернему элементу. Последовательность триггера – сначала захват, а затем всплывающее воспроизведение. Обратите внимание, что в месте запуска события не происходит всплывающего и захвата. Выполняются только обычные события. Последовательность выполнения соответствует порядку написания кода. Такие события, как фокус, размытие , изменение, отправка, сброс и выбор не выполняются.

  25. Разговор о понимании requestAnimationFrame

  26. Разница между файлами cookie/localstorage/sessionsstore/indexDB?

    Статьи по Теме:Блог Woohoo.cn на .com/fun bug/fear/…

  27. Какие поля могут быть установлены в файле cookie?

    Статьи по Теме:blog.CSDN.net/QQ_39834073…

    имя и стоимость:name и value — это пара ключ-значение. name — это имя файла cookie. После создания файла cookie имя нельзя изменить. Как правило, имя не чувствительно к регистру; значение — это значение файла cookie, соответствующее имени. Если значение представляет собой символы Юникода, оно должна быть кодировка символов. Если значение представляет собой двоичные данные, вам необходимо использовать кодировку base64.

    Domain: Домен определяет, для какого домена действителен файл cookie, то есть решает, следует ли переносить этот файл cookie при отправке запроса на этот домен. Настройки домена действуют для субдоменов.Например, если для домена установлено значение .a.com, оба b.a.com и c.a.com могут использовать этот файл cookie, но если для него установлено значение b.a.com, c.a.com не может использовать этот файл cookie. Параметр домена должен начинаться с точки (".").

    Path: Путь — это допустимый путь файла cookie, аналогичный Домену, а также действительный для подпутей. Например, домены файлов Cookie1 и Cookie2 — оба a.com, но пути разные. Путь файла Cookie1 — /b /, а путь файла cookie — /b/c/, то на странице a.com/b можно получить доступ только к файлу cookie1, а на странице a.com/b/c — к файлам cookie1 и cookie2. Свойство Path должно заканчиваться символом «/».

    Истекает/максимальный возраст:Expires и Max-age — это срок действия файла cookie. Expires — это отметка времени, когда файл cookie был удален, в формате GMT. Если для него установлено предыдущее время, файл cookie будет удален немедленно, а отметка времени время сервера, а не местное время.время! Если не установлено, файл cookie будет удален при закрытии страницы по умолчанию. Max-age также является сроком действия файла cookie, но его единицей измерения являются секунды, то есть через сколько секунд он истечет.Если Max-age установлен на 0, он истечет немедленно, а если отрицательное число, срок его действия истечет при закрытии страницы. Максимальный возраст по умолчанию равен -1.

    Size: Szie — это размер этого файла cookie. Во всех браузерах любой размер файла cookie, превышающий лимит, игнорируется и никогда не устанавливается. Каждый браузер имеет разные ограничения на максимальное и максимальное количество файлов cookie, которые организованы в виде следующей таблицы (сеть источника данных, не проверено):

    браузер Максимальное количество файлов cookie Максимальная длина/единица измерения файла cookie: байты
    IE 50 4095
    Chrome 150 4096
    FireFox 50 4097
    Opera 30 4096
    Safari неограниченный 4097

    Только HTTP:Значение HttpOnly равно true или false. Если установлено значение true, изменить это значение с помощью скрипта document.cookie нельзя. Кроме того, это значение не отображается в document.cookie, но этот файл cookie по-прежнему будет передаваться, когда отправка запросов.

    Безопасный:Безопасный — это атрибут безопасности файла cookie. Если установлено значение true, браузер будет передавать этот файл cookie только по безопасным протоколам, таким как HTTPS и SSL, и не будет передавать этот файл cookie по небезопасным протоколам HTTP.

    Тот же сайт:SameSite используется для ограничения сторонних файлов cookie, тем самым снижая риски безопасности. Он имеет 3 свойства, а именно: Scrict является самым строгим, полностью запрещает сторонние куки и не будет отправлять куки ни при каких обстоятельствах при межсайтовом размещении; Слабые правила немного смягчены, и сторонние куки не отправляются в большинстве случаев , но перейдите к разделу За исключением получения запросов к целевым URL-адресам;

    None, сайты могут явно отключить атрибут SameSite, установив для него значение None. Однако предпосылка заключается в том, что атрибут «Безопасный» должен быть установлен одновременно (файлы cookie могут отправляться только по протоколу HTTPS), в противном случае он недействителен. Метод закрытия SameSite: Метод операции Ввод адресной строки браузера Google: chrome://flags/ find: SameSite по умолчанию для файлов cookie, файлы cookie без SameSite должны быть безопасными. Установите для двух вышеуказанных параметров значение «Отключить».

    Priority: Приоритет, предложение Chrome, определяет три приоритета: Низкий/Средний/Высокий, когда количество файлов cookie превышается, файлы cookie с низким приоритетом будут очищены в первую очередь. В браузере скорости 360 и FireFox атрибута Priority не существует, и неясно, будет ли этот атрибут действовать после установки этого атрибута в таких браузерах.

  28. Вы понимаете порядок соответствия css?

    Порядок соответствия css справа налево. Потому что справа налево эффективнее.

  29. Вы знаете о vue3?

Содержимое второй стороны не впечатлило.

Футу три стороны

У меня нет впечатления об одной или двух сторонах.Футу не пишет много алгоритмов, но в основном у каждой стороны есть вопросы-головоломки/код.Не стоит увеличения

  1. Головоломка: Обезьяны едят персики
  2. Вероятностный вопрос: Вероятность в покере
  3. Заголовок кода: Разделить URL, чтобы убрать параметры
  4. Внедрить атаку браузера xss и xsrf
  5. Познакомить с разницей между антитряской и дросселированием

крипта рядом

Знакомство с хедхантингом — это блокчейн-компания с более чем 20 ежегодными отпусками каждый год. Перед собеседованием я прошел письменный тест из 5 вопросов по алгоритму и получил уведомление о собеседовании.После одного собеседования я почувствовал, что интервьюер достаточно компетентен, но по личным причинам отказался от следующего собеседования.

  1. Вы понимаете flex/grid, как реализовать адаптивную верстку (несколько блоков с одинаковым интервалом)
  2. Вы понимаете каскадные контексты CSS? Когда для дочернего элемента установлено значение position:fixed, какое позиционирование относительно чего, и когда для родительского элемента установлено значение перевода, какое позиционирование имеет дочерний элемент относительно?
  3. Внедрение междоменных и предварительных запросов;
  4. Представьте шаги xmlhttprequest;
  5. Расскажите о разнице между модулем es6 и модулем commonjs;
  6. Представьте цикл событий, понимаете ли вы момент времени выполнения микрозадач?
  7. Представьте механизм обработки кеша в http. Знаете, каковы недостатки истечения срока действия? Какой тип данных хранится в expires? Какой тип данных хранится в max-age cache-control? Говорите о кэше переговоров?
  8. Вы понимаете разницу между картой и слабой картой?
  9. Расскажите о своем понимании фронтенд-инжиниринга;

Некоторые вопросы интервью

Когда я записывал это раньше, я помнил только несколько тем, которые были более впечатляющими, и забыл вспомнить компанию.Большинство тем ниже взяты из Ping An/Weizhong/Baidu. Между прочим, я лично считаю, что опыт интервью Baidu очень хорош.В Weizong есть оценка личности, которую каждый должен пройти хорошо (после трех собеседований хедхантер сказал, что оценка личности отложена на год и не может быть взята, кто знает боль), давайте не будем говорить о Ping An......

  1. Promise, разница между async/await, сценарии использования

  2. Цепочка прототипов/наследование

    Цепочка прототипов является основным методом реализации наследования. Идея состоит в том, чтобы использовать прототип, чтобы позволить одному ссылочному типу наследовать свойства и методы другого ссылочного типа. Если мы делаем объект-прототип равным экземпляру другого типа, то прототип объект будет содержать указатели на другой тип.Указатель на прототип, и если другой объект-прототип является экземпляром другого прототипа, то вышеприведенное отношение остается в силе, и цепочка экземпляров и прототипов формируется постепенно слой за слоем, что является концепция цепочки прототипов.

    Наследование: наследование по цепочке прототипов, наследование конструктора, комбинированное наследование, наследование прототипов (object.create()), паразитное комбинированное наследование, класс класса

  3. Какие есть методы у функции? позвонить/подать заявку/привязать понятно? Можно ли написать от руки?

    //call
    Function.prototype.myCall = function(context, ...arr) {
      if(context === null || context === undefined) {
        context = window;
      } else {
        context = Object(context);
      }
      const fn = Symbol('fn');
      context[fn] = this;
      let result = context[fn](...arr);
      delete context[fn];
      return result;
    }


    //bind
    Function.prototype.myBind = function(objThis,...params) {
      let thisFn = this;
      let fToBind = function(...secondParams) {
        let isNew = this instanceof fToBind;
        let context = isNew ? this : Object(objThis);
        return thisFn.call(context,...params,...secondParams);
      }
      if(thisFn.prototype) {
        fToBind.prototype = Object.create(thisFn.prototype);
      }
      return fToBind;
    }

  4. Расскажите о механизме обработки HTTP-кэша? Какие коды состояния возвращаются кэшем согласования принудительного кэша? Знаете, каковы недостатки истечения срока действия? Какой тип данных хранится в expires? Какой тип данных хранится в max-age cache-control?

    HTTP-кэш делится на обязательный кеш и кеш согласования, среди которых обязательный кеш: http1.0-expired, http1.1-cache-control: private/public/no-cache/no-store/max-age. Кэш согласования: http1.0 — last-modified (заголовок ответа)/if-modify-since (заголовок запроса), http1.1 — etag (заголовок ответа)/if-none-match (заголовок запроса). И expires, и max-age можно использовать для указания срока действия документа, но между ними есть некоторые тонкие различия. Expires хранит абсолютное время истечения, что вызовет как минимум две проблемы: 1. Время клиента и сервера не синхронизировано, что приводит к проблемам в настройке истечения 2. После настройки легко забыть конкретное время истечения, в результате возникает явление всплеска, когда истечет срок действия; max-age указывает время выживания после доступа к документу. Это время является относительным значением (например, 3600 с), которое относится к request_time (времени запроса), записанному сервером. при первом запросе документа. Кроме того, время, указанное в параметре expires, на самом деле может быть временем последнего доступа (atime) или временем модификации (atime) соответствующего файла.

  5. Разговор о tcp три рукопожатия четыре волны.

  6. Что такое модификаторы vue?

    Модификаторы событий: остановить, предотвратить, захватить, самостоятельно, один раз, пассивно

    Клавиши-модификаторы: ввод, табуляция, удаление, esc, пробел, вниз, вверх, влево, вправо, точно

    Модификаторы мыши: левый, правый, средний

    sync

    Модификаторы формы: lazy, number, trim

  7. Общие заголовки HTTP-запросов

    Например, кешировать заголовки запроса серии, принимать заголовки запроса серии (принять, принять-кодировку, принять-кодировку, принять-язык), пользовательский агент, хост, файл cookie, соединение, происхождение, реферер,

  8. Страница имеет несколько форм, как решить проверку при отправке

    Вы можете использовать обещание.все

  9. Построение деревомерного массива

function getTree() {
  let map = new Map();
  arr.forEach(item => {
    map.set(item.id,item);
  })
  let tree;
  arr.forEach(node => {
    let parent = map.get(node.parentId);
    if(parent) {
      if(!parent.children) {
        parent.children = [];
      }
      parent.children.push(node);
    } else {
      tree.push(node)
    }
  })
  return tree;
}

  1. Веб-безопасность связана, почему бы не иметь проблемы csrf с токеном?

    Файл cookie имеет срок действия. В течение этого времени файл cookie хранится на стороне клиента. При повторном посещении того же веб-сайта браузер автоматически установит файл cookie после того, как пользователь войдет на сайт в http-запросе. Атака csrf также использует это преимущество, заимствуя пользовательский файл cookie для выполнения операций, не предусмотренных пользователем. Правило проверки токена заключается в том, что сервер повторно получает установленный токен из тела запроса или параметров запроса, а затем сравнивает его с токеном в куке, и если он непротиворечив, выполняется последующий запрос, и только csrf-атака заимствует файл cookie, поэтому его нельзя использовать при отправке запроса.Когда токен установлен в post или get и запрос отправляется на сервер, проверка токена завершается с ошибкой, и запрос не будет обработан. (сомнительно)

  2. Как получить отзывчивые данные в компиляции шаблона vue

  3. Плагины Webpack параллельны или последовательны? Расскажите о рабочем процессе и принципах веб-пакета? Может ли plugin1 отправлять события для plugin2 для прослушивания?

  4. Как функция в вычислении собирает зависимости всех используемых в ней переменных? А что внутри часов?

  5. Вы слышали о другой экологии? Например, реагировать, почему так разработан апплет, р-н, флаттер

  6. Какие плагины сейчас настроены в webpack?

  7. Какой загрузчик должен быть настроен для записи jsx в проекте vue?

  8. Регулярно понимаете?

  9. Принцип горячего обновления Webpack

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

Категории