Запатентованное руководство по собеседованию с интерфейсом DingTalk

интервью внешний интерфейс

об авторе

Зийи, член проприетарной команды интерфейса DingTalk, ответственный за разработку проприетарного клиента DingTalk для ПК, приложений для устройств и разработки подключаемых модулей для модулей на устройствах.

предисловие

В этой статье в основном представлены вопросы интервьюера Зийи в группе, которые используются для обучения передовым знаниям для всех.Я надеюсь, что это будет полезно для студентов, которые претендуют на работу, и свежих выпускников, которые готовятся к осенний набор. Если вам действительно нужны подробности, вы можете спросить Ziyi.

Напоминание: я не буду слишком много объяснять о наборе Али в школу и процессе социального набора.Если вы заинтересованы в процессе набора в школу, вы можете прочитатьСобственное руководство по набору персонала в кампусе DingTalk, если вы заинтересованы в процессе социального найма и данных, вы можете просмотретьКак я стал интервьюером на Али.

Содержание проверки

Одностороннее интервью проприетарного DingTalk в основном рассматривает следующие три аспекта:

  • Базовые знания: проверьте, есть ли у интервьюируемого солидная система базовых знаний.

  • Деловое мышление: изучите глубину бизнеса интервьюируемого

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

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

Базовые знания

Основные знания в основном включают следующие аспекты:

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

  • Грамматика: понимание и использование грамматик, таких как JavaScript, ECMAScript, CSS, TypeScript, HTML, Node.js и т. д.

  • Framework: понимать и использовать принципы React, Vue, Egg, Koa, Express, Webpack и т. д.

  • Инжиниринг: инструменты компиляции, инструменты форматирования, Git, NPM, модульное тестирование, Nginx, PM2, понимание и использование CI/CD.

  • Сеть: понимание HTTP, TCP, UDP, WebSocket, Cookie, Session, междоменного доступа, кеша, протокола.

  • Производительность: производительность компиляции, мониторинг, обнаружение белого экрана, SEO, Service Worker и т. д.

  • Плагины: понимание идей дизайна плагинов, таких как Chrome, Vue CLI, Webpack и т. д.

  • Система: Практика для Mac, Windows, конфигурации системы Linux

  • Серверная часть: кеш Redis, база данных, Graphql, SSR, механизм шаблонов и т. д., чтобы понять и использовать

База

  • Перечислите известные вам типы компьютерных запоминающих устройств?

  • В каком устройстве компьютера хранится общий код? Как код работает в процессоре?

  • Что такое инструкции и наборы инструкций?

  • В чем разница между сложным набором инструкций и сокращенным набором инструкций?

  • Как работает JavaScript? В чем разница между интерпретируемым и компилируемым языками?

  • Кратко опишите процесс компиляции Babel?

  • Как массивы и функции в JavaScript хранятся в памяти?

  • В чем разница между механизмом цикла событий в браузерах и Node.js?

  • Каковы преимущества модулей ES6 по сравнению с CommonJS?

  • Как языки программирования высокого уровня компилируются в машинный язык?

  • Из каких этапов обычно состоит компилятор? На каком этапе обычно выполняется проверка типов данных?

  • Какова роль виртуальной машины во время компиляции?

  • Что такое промежуточный код (IR) и что он делает?

  • Что такое кросс-компиляция?

  • В чем разница между шаблоном публикации/подписки и шаблоном наблюдателя?

  • Когда обычно используется шаблон декоратора?

  • Расскажите о своем понимании дизайна разделения кода для больших проектов? Что такое МОК? Какой шаблон проектирования используется для общего внедрения зависимостей?

  • Перечислите известные вам парадигмы программирования?

  • Что такое аспектно-ориентированное программирование (АОП)?

  • Что такое функциональное программирование? Что такое реактивное программирование? Что такое функциональное реактивное программирование?

  • Каковы варианты использования реактивного программирования или функционального реактивного программирования?

грамматика

  • Как реализовать верхнюю, среднюю и нижнюю трехстрочную верстку, минимальная высота верха и низа 100px, а середина адаптивная?

  • Как оценить переполнение стиля CSS элемента, чтобы можно было выборочно добавить заголовок или всплывающую подсказку?

  • Как сделать так, чтобы элементы CSS автоматически переполнялись слева (... переполнялись слева)?

  • Что такое песочница? Что делает песочница браузера?

  • Как справиться с проблемами автозаполнения пароля для элементов формы в браузерах?

  • Каковы различия, преимущества и недостатки маршрутизации Hash и History?

  • Могут ли константные массивы в JavaScript быть push-управляемыми? Зачем?

  • Каковы дескрипторы свойств объектов в JavaScript? Каков эффект каждого?

  • Какие API существуют для консоли в JavaScript?

  • Просто сравните плюсы и минусы нескольких асинхронных API, таких как Callback, Promise, Generator и Async?

  • Сколько параметров имеет Object.defineProperty? Что делает каждый?

  • В чем разница между Object.defineProperty и прокси ES6?

  • Каковы сценарии использования Symbol, Map и Decorator в ES6? Или вы видели использование этих API в исходном коде каких библиотек?

  • Зачем использовать TypeScript и в чем преимущества TypeScript перед JavaScript?

  • Разница между const и readonly в TypeScript? Разница между перечислением и постоянным перечислением? Разница между интерфейсом и псевдонимом типа?

  • Какова роль любого типа в TypeScript?

  • В чем разница между any, never, unknown и void в TypeScript?

  • Может ли интерфейс в TypeScript объявлять функцию/массив/класс (индексируемый)?

  • Может ли TypeScript использовать String, Number, Boolean, Symbol, Object и т. д. для объявления типов?

  • В чем разница между этим в TypeScript и этим в JavaScript?

  • Каковы соображения при использовании союзов в TypeScript?

  • Как TypeScript разрабатывает объявления классов?

  • Как объединить ключи типов перечисления в TypeScript?

  • Каковы значения таких символов, как ?., ??, !., _, ** в TypeScript?

  • Каковы предопределенные условные типы в TypeScript?

  • Кратко представить механизм загрузки модулей TypeScript?

  • Кратко расскажите о своем понимании совместимости типов TypeScript? Простое понимание антивариантности, бивариантности, ковариации и контравариантности?

  • Существуют ли какие-либо побочные эффекты разворачивания объекта в TypeScript?

  • Имеют ли объявления интерфейса, типа и перечисления в TypeScript функции области видимости?

  • Можно ли объединить в TypeScript интерфейс с одинаковым именем или интерфейс и класс с одинаковым именем?

  • Как заставить проект TypeScript подтягиваться и распознавать пакеты библиотеки npm, скомпилированные в JavaScript?

  • Какая информация об элементе конфигурации находится в файле tsconfig.json TypeScript?

  • Как установить псевдоним пути импорта модуля в TypeScript?

Рамка

  • Какие периодические функции есть у компонентов класса React? Каков эффект каждого?

  • Можно ли выполнять запросы в компонентах React Class в componentWillMount? Зачем?

  • В чем разница между компонентами React Class и React Hooks?

  • Плюсы и минусы функций высшего порядка и пользовательских хуков в React?

  • Кратко объясните, как useState и useEffect работают в React Hook?

  • Как React обнаруживает повторный рендеринг, что вызывает повторный рендеринг и как избежать повторного рендеринга?

  • Каковы параметры useEffect в React Hook и как обнаружить изменения в зависимостях массива?

  • Как React useEffect прослушивает изменения в зависимостях массива?

  • Какая связь между React Hook и замыканием?

  • Как useState выполняет инициализацию данных в React?

  • Перечислите свои общие советы по оптимизации производительности React?

  • Как разрешаются директивы в шаблонах Vue 2.x?

  • Кратко объясните полный механизм работы Vue 2.x?

  • Кратко представить дизайн фреймворка Element UI?

  • Как понять, что Vue — это прогрессивный фреймворк?

  • Как реализовать межкомпонентное взаимодействие в Vue?

  • Как реагирующие данные в Vue отслеживают свойства объекта на глубоком уровне?

  • В чем разница между MVVM, MVC и MVP? Какие сценарии применения у них есть? ,

  • Что такое MVVM-фреймворк?

проект

  • Каковы особенности Vue CLI 3.x? Вы понимаете систему плагинов Vue CLI 3.x?

  • Как собирается Webpack в Vue CLI 3.x?

  • Как Vue 2.x поддерживает синтаксис TypeScript?

  • Как настроить среду, чтобы проект JavaScript мог поддерживать синтаксис TypeScript?

  • Как проверить TypeScript на линте? В чем разница между ESLint и TSLint?

  • Как Node.js поддерживает синтаксис TypeScript?

  • Как TypeScript автоматически генерирует файлы объявлений для пакетов библиотек?

  • Каковы ограничения поддержки TypeScript в Babel?

  • В чем разница между загрузчиком и плагином в Webpack?

  • Как Webpack поддерживает позиционирование Sourcemap, аналогичное синтаксису JSX?

  • Как указать адрес импорта при публикации пакета Npm?

  • Как опубликовать определенную папку проекта разработки в качестве корневого каталога пакета Npm?

  • Как опубликовать пакет Npm, поддерживающий механизм Tree Shaking?

  • Какова роль peerDependencies в пакетах Npm?

  • Как изящно отлаживать пакеты Npm, которые необходимо выпустить?

  • Как создать журнал версий при разработке некоторых пакетов библиотек?

  • Знаете о подмодулях Git (Submodule)? Кратко опишите роль подмодулей Git?

  • Как Git изменяет информацию о зафиксированном коммите?

  • Как Git отменяет коммит и сохраняет предыдущие изменения?

  • Как Git игнорирует зафиксированные файлы?

  • Как стандартизировать инструкции Git по фиксации (информация о фиксации) при использовании Git?

  • Кратко опишите структуру спецификации фиксации, которая соответствует спецификации Angular?

  • Как информация о фиксации связана с проблемами Github?

  • Какую роль Git Hook играет в проекте?

  • Каковы функции клиентских и серверных хуков в Git Hook?

  • Какие хуки обычно используются в Git Hook?

  • В чем разница между хуками pre-commit и commit-msg? Для чего можно использовать каждый?

  • Каков принцип создания Git Hook с помощью таких инструментов, как хаски и гук?

  • Как спроектировать общий Git Hook?

  • Можно ли разрабатывать Git Hooks с помощью сценариев Node? Как это сделать?

  • Как я могу убедиться, что код, загруженный другими, не содержит ошибок Lint? Как я могу убедиться, что мой код строится без ошибок Lint?

  • Как выполнить запрос проверки Lint в Vs Code? Как сохранить форматирование в Vs Code?

  • В чем разница между ESLint и Prettier? Будут ли проблемы, когда они будут работать вместе?

  • Как эффективно определить правила формата, которые могут конфликтовать между ESLint и Prettier? Как решить такие конфликты правил?

  • Как заставить ESLint печатать сообщения об ошибках проверки в режиме реального времени при горячей замене модуля в обычном проекте строительных лесов?

  • Расскажите о своих знаниях SourceMap?

  • Как отлаживать код Node.js? Как отлаживать код Node.js TypeScript? Как отлаживать код Node.js в браузере?

  • Перечислите все инструменты сборки, которые вы знаете, и расскажите об их плюсах и минусах? Как следует выбирать эти строительные инструменты в различных сценариях?

  • В чем разница между пользователем и рабочей областью в конфигурации VS Code?

  • Могут ли плагины VS Code действовать только в текущем проекте?

  • Какие типы тестов вы знаете о тестировании?

  • Какие фреймворки для тестирования вы знаете?

  • Что такое e2e-тест? Какие существуют тестовые фреймворки для e2e?

  • Теперь предположим, что существует алгоритм сортировки вставками, как я могу провести модульное тестирование этого алгоритма?

Интернет

  • Как служба CDN обеспечивает ускорение сети?

  • Использует ли WebSocket протокол TCP или UDP?

  • Что такое симплексная, полудуплексная и полнодуплексная связь?

  • Кратко опишите процесс передачи протокола HTTP для отправки URL-запроса с доменным именем? (DNS, TCP, IP, ссылка)

  • Что такое прямой прокси? Что такое обратный прокси?

  • Могут ли файлы cookie создаваться на стороне сервера? Каков рабочий процесс после создания файла cookie на сервере?

  • В чем разница и связь между сеансом и файлом cookie? Как сделать временное и постоянное хранилище сеансов?

  • Как предотвратить XSS-атаки при установке файлов cookie?

  • Кратко опишите процесс реализации безпользовательского входа? Какие проблемы с безопасностью могут возникнуть? Как зашифровать пароль пользователя для входа?

  • Какие есть способы увеличить скорость передачи в HTTP? Каковы наиболее часто используемые методы кодирования контента?

  • Если в процессе передачи изображений произошел внезапный перерыв, как я могу возобновить передачу с предыдущего прерывания после возобновления?

  • Что такое прокси? Что такое шлюз? Какова роль прокси и шлюзов?

  • Почему HTTPS более безопасен и надежен, чем HTTP?

  • Что такое шифрование с симметричным ключом (общим ключом)? Что такое шифрование с асимметричным ключом (открытым ключом)? Что более безопасно?

  • Каковы, по вашему мнению, текущие недостатки протокола HTTP?

представление

  • Как идентифицировать форму в элементе формы в React для минимальной детализации/стоимости рендеринга?

  • Какие способы контроля затрат на рендеринг при разработке React вы можете придумать?

плагин

  • Как устроена система плагинов Vue CLI 3.x?

  • Как устроен механизм плагинов в Webpack?

система

  • В чем разница между \r\n (CRLF) и \n (LF)? (Нижний правый угол Vs Code можно переключать)

  • Что делает /dev/null?

  • Как установить псевдоним для команды в Терминале на Mac?

  • Как установить переменные среды в Windows?

  • Чувствительна ли файловая операционная система Mac по умолчанию к путям к файлам?

  • Как установить абсолютный путь к файлу при написании сценария оболочки?

задняя часть

  • В чем разница и связь между сеансом и файлом cookie? Как сделать временное и постоянное хранилище сеансов?

  • Как развернуть приложение Node.js? Как быть с согласованностью сессий при балансировке нагрузки?

  • Как повысить стабильность работы кода Node.js?

  • В чем разница между GraphQL и Restful и в чем их преимущества?

  • Как работает Vue SSR? Как отображать данные Vuex изоморфно?

  • Каковы соответствующие преимущества и недостатки технологии SSR и технологии SPA?

  • Как справиться со стрессом, связанным с рендерингом HTML в Node.js?

деловое мышление

Бизнес-мышление — это скорее конкретная деловая практика в сочетании с широтой и глубиной базовых знаний, которые в основном включают следующие аспекты:

  • Инжиниринг: развертывание кода, проектирование процессов CI/CD, Jenkins, Gitlab, Docker и т. д.

  • Универсальность: дизайн фреймворка, такой как строительные леса, SDK, библиотека компонентов и т. д.

  • Среда приложения: гибрид, микро-интерфейс, BFF, монорепозиторий

  • Визуализируйте:

  • Низкий уровень кода: общий дизайн формы, общий дизайн макета, общий дизайн страницы, дизайн протокола JSON Schema и т. д.

  • Тестирование: E2E-тестирование, модульное тестирование, тестовое покрытие, тестовые отчеты и т. д.

  • Бизнес: данные, опыт, сложность, мониторинг

Инжиниринг

  • Какие инструменты CI/CD вы знаете? Сталкивались ли вы с подобным процессом в проекте?

  • Если бы вас попросили внедрить веб-интерфейсную платформу инженерной разработки CI/CD, как бы вы ее спроектировали?

  • Если нам нужно преобразовать ресурсы онлайн-продуктов (например, изображения) в существующих проектах в локальные приватизированные ресурсы, какие у вас есть решения?

  • Как настроить скаффолд с помощью Vue CLI 3.x? Например, i18n, axios, Element UI, защита маршрутизации и т. д. автоматически интегрируются внутри?

  • Как Jenkins работает со сценариями Node.js для проектирования CI/CD?

общность

  • Если бы вас попросили разработать типовой проект строительных лесов, как бы вы его спроектировали? Какими возможностями вообще должны обладать общие леса?

  • Если бы вас попросили спроектировать общую библиотеку инструментов, как бы вы ее спроектировали? Какими возможностями обычно должна обладать общая библиотека инструментов?

  • Предположим, вы реализуете библиотеку компонентов React или Vue для разработки демонстрационного документа. Как бы вы ее разработали? Какие функции должны выполнять разработанные документы?

  • Как вы разрабатывали документацию по API при разработке пакета инструментов?

структура приложения

  • Говорите о понимании Electron, Nw.js, CEF, Flutter и нативной разработки?

  • Говорите о понимании HotFix в десктопных приложениях?

  • Как вы думаете, в каких сценариях нужно использовать микроинтерфейс?

бизнес

  • Что такое единый вход? Как сделать единый вход?

  • Как сделать международный проект ради проекта?

  • Как составить план мониторинга и отслеживания проекта?

  • Как обеспечить стабильность проекта (мониторинг, оттенки серого, понижение версии ошибки, откат...)?

  • Какие оптимизации производительности необходимо учитывать для фоновых приложений общего управления?

  • Кратко опишите некоторые случаи и технические решения для улучшения работы над проектом (скелетный экран, обработка загрузки, кэширование, устранение ошибок, повтор запроса...)?

  • Предположим, вам нужно разработать схему водяного знака для страницы, как бы вы ее разработали?

низкий код

  • Как разработать общий протокол схемы JSON, чтобы он мог динамически отображать общую форму связи?

  • Какими возможностями должна обладать типичная low-code платформа?

Письменная тестовая практика

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

  • регулярное выражение

  • алгоритм

  • структура данных

  • Шаблоны проектирования

  • Часть принципа реализации фреймворка

  • Синтаксис TypeScript

  • Разбор шаблона

структура данных

  • Преобразование плоских данных без иерархии в данные с древовидной структурой с использованием синтаксиса TypeScript
// 扁平数据
[{
  name: '文本1',
  parent: null,
  id: 1,
}, {
  name: '文本2',
  id: 2,
  parent: 1
}, {
  name: '文本3',
  parent: 2,
  id: 3,
}]

// 树状数据
[{
  name: '文本1',
  id: 1,
  children: [{
    name: '文本2',
    id: 2,
    children: [{
      name: '文本3',
      id: 3
    }]
  }]
}]

Разбор шаблона

Реализовать простой шаблонизатор

const template = '嗨,{{ info.name.value }}您好,今天是星期 {{ day.value }}';

const data = {
  info: {
    name: {
      value: '张三'
    }
  },
  day: {
    value: '三'
  }
};

render(template, data); // 嗨,张三您好,今天是星期三

Шаблоны проектирования

Простая реализация шаблона публикации/подписки

регулярное выражение

Совпадение с xxx в const a = require('xxx') в строке

Набор персонала

Привет, собственная команда разработчиков интерфейса DingTalk в настоящее время набирает отличных инженеров по разработке интерфейса.Если вас интересует наша вакансия, вы можете связаться с нами, чтобы отправить свое резюме.