Front-end | 5 вопросов на собеседовании в день (5)

опрос
Front-end | 5 вопросов на собеседовании в день (5)

Заучивайте по 5 уроков каждый день, обязательно заучивайте и запоминайте, надеюсь немного поможет фронтенду в поиске работы

1. Объясните переменное продвижение

  • Все объявления поднимаются на самый верх области видимости.

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

Например:

(1) Вариативное продвижение

    console.log(a);  //undefined
    var a = 123;

Потому что объявление переменной a упоминается в верхней части области видимости. Приведенный выше код должен выглядеть так после компиляции

    var a;
    console.log(a)
    a = 123
    //所以输出内容为 undeifend

(2) Продвижение функции

Есть два способа объявить именованную функцию: 1. Объявление функции 2. Функциональный литерал

//函数声明式
function bar () {}
//变量形式声明； 
var foo = function () {}

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

Феномен продвижения объявления функции немного отличается от продвижения переменной.Объявление функции будет перемещено в начало области, а содержимое объявления будет перемещено наверх вместе.

См. пример:

bar()

var bar = function() {
  console.log(1);
}
// 报错：TypeError: bar is not a function


bar()
function bar() {
  console.log(1);
}
//输出结果1

2. Какие новые функции были добавлены в ES6+

  • объявить let / const

  • присваивание деструктуризации

  • class / extend: Объявление класса и наследование

  • Set / Map: новая структура данных

  • стрелочная функция

  • promise

  • async/await

  • расширение массива

  • расширение объекта

3. Разница между let и const

  • let / const: область действия на уровне блоков, без продвижения переменных, временная мертвая зона, без повторных объявлений
  • const: объявить константы и не могут быть изменены (базовые типы не могут быть изменены, ссылочные типы, такие как объекты и массивы, могут быть изменены)

4. Каково использование async и await?

асинхронная функция - это функция генератора синтаксического сахара, асинхронная функция всегда возвращает обещание, ожидание возможно для достижения функции «ожидания», вызов асинхронного / ожидающегоИдеальное решение для асинхронного программирования, то есть писать асинхронный код в синхронной форме и может более элегантно реализовать последовательное выполнение асинхронного кода и предоставлять более точную информацию об ошибке при возникновении асинхронной ошибки.

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

Так называемый Promise — это просто контейнер, содержащий результат события (обычно асинхронной операции), которое завершится в будущем. Синтаксически Promise — это объект, из которого можно получить сообщение для асинхронной операции. Обещания предоставляют унифицированный API, и различные асинхронные операции могут обрабатываться одинаково.

Есть три состояния:

  1. в ожидании
  2. завершено (решено)
  3. отклоненный

Promiseизнедостаток:

  • Во-первых, нет возможности отменитьPromise, как только он будет создан, он будет выполнен немедленно и не может быть отменен на полпути.
  • Во-вторых, если вы не установите функцию обратного вызова,PromiseОшибки, возникающие внутри, не будут отражаться снаружи.
  • В-третьих, когда вpendingКогда он находится в состоянии, невозможно узнать, на каком этапе он находится в данный момент (только что начат или вот-вот завершится).

Какая проблема была решена:

PromiseПоявление решает предыдущеепроблема с обратным вызовом,а такжеPromiseРеализованы связанные вызовы, то есть каждый вызовthenЗатем он возвращаетPromise, и это совершенно новыйPromise. Потому чтоPromiseСостояние неизменно. если тыthenиспользуется вreturn,Такreturnзначение будетPromise .resolveУпаковка.

Рукописное обещание [ключевой момент]

//newPromise.js

const PENDING = 'pending'
const FULFILLED = 'fulfilled'
const REJECTED = 'rejected'

class NewPromise {
    constructor(executor) {
        executor(this.resolve,this.reject)
    }
    //promise状态
    status = PENDING
    value = undefined
    reason = undefined
    //值默认没有
    resolve = value => {
        //如果状态不是等待，阻止程序向下执行
        if(this.status !== PENDING)return
        this.status = FULFILLED
        this.value = value
    }
    //使用箭头函数的原因：直接调用一个普通函数，函数里面的this指向是undefined的
    reject = reason => {
        if(this.status !== PENDING)return
        //将状态更改为失败
        this.status = REJECTED
        this.reason = reason
    }
    //判断promise的状态，返回回调函数，需要传递value和reason
    then(successCallback,failCallback){
        //判断状态
        if(this.status === FULFILLED){
            successCallback(this.value)
        }else if(this.status === REJECTED){
            failCallback(this.reason)
        }
    }
}

module.exports = NewPromise

Обещание, написанное пользователем сети по имени «Сетка», давайте посмотрим, что с ним не так.

class promise {
  constructor(fn) {
    this.state = 'pending'
    this.resolveCbs = []
    this.rejectCbs = []
    this.resolve = this.resolve.bind(this)
    this.reject = this.reject.bind(this)
    fn(this.resolve, this.reject)
  }

  resolve(data) {
    this.successData = data
    this.state = 'resolve'
    this.resolveCbs.forEach(cb => {
      cb && cb(this.successData)
    })
  }

  reject(data) {
    this.failData = data
    this.state = 'reject'
    this.rejectCbs.forEach(cb => {
      cb && cb(this.failData)
    })
  }

  then(cb) {
    cb && this.resolveCbs.push(cb)
    return this
  }

  catch(cb) {
    cb && this.rejectCbs.push(cb)
    return this
  }
}

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

Категории