royidoodle / fe-interview-chaos Goto Github PK

View Code? Open in Web Editor NEW

33.0 33.0 9.0 284 KB

前端面试题大合集

HTML 10.97% JavaScript 77.64% TypeScript 11.40%

css front-end interview js promise vue

fe-interview-chaos's Introduction

前端面试大杂烩

希望可以为各位同学查缺补漏、温故知新，不希望前端学习最后成为"应试教育"

欢迎互动

大家可以关注微信公众号 —— 较真的前端，来参与互动

贡献者

欢迎提供你的面试题

请通过提交Issue的方式来分享你的面试题。

fe-interview-chaos's People

Contributors

Stargazers

Watchers

Forkers

saikasakura desandchen charley-hsu wangzixuan01 kongfuboy123 lubo-fline zhuzhuziye xiang0308 evilybingo

fe-interview-chaos's Issues

0002. Vue双向绑定原理

请描述一下Vue的双向绑定原理

0008. 使用原生JS实现一个Promise

使用原生JS实现一个Promise。
至少包括以下三点：

Promise的构造函数
Promise.prototype.then
Promise.prototype.catch方法

0003. Vue中父子组件是如何实现通信的

描述一下在Vue中，父子组件是如何通信的？包括父组件如何与子组件通信，子组件如何和父组件通信

0009. 实现一个全量输出promise结果（成功和失败）的方法

详细说明

实现一个方法Promise.total(Array<Promise>)。它接受的参数是由多个Promise实例构成的数组，返回值仍然是一个Promise实例。这个promise所resolve的值是传入的Array<Promise>所有结果，返回格式如下：

[
    {
        // 成功情况下，success为true，data为promise实例的决议值
        success: true,
        data: 'resolved data'
    },
    {
        // 失败情况下，success为false，data为promise实例的决绝原因
        success: false,
        data: 'rejected reason'
    }
]

示例

Promise.total([
  Promise.resolve('p1'),
  Promise.reject('p2'),
  Promise.resolve('p3')
]).then(resultList => {
    // 这里输出的是
// [
//     {
//         success: true,
//         data: 'p1'
//     },
//     {
//         success: false,
//         data: 'p2'
//     },
//     {
//         success: true,
//         data: 'p3'
//     }
// ]
    console.log(resultList);
});

应用场景

假设需要实现一个日报邮件定时推送功能，日报需要分别获取三个接口的数据，分别为订单总数、优惠券发放总数、会员总数，现在要求三个接口并发请求，三个接口都请求完成后将数据拼装并发送日报，可能会出现有接口请求失败的情况，如果失败则忽略失败数据，只发送成功获取的数据。

0007. 实现一个bind函数不能使用bind、apply、 call

0005. Vue中data定义的属性与computed中定的属性有什么不同？

如下面代码，foo定义在data中，bar定义在computed中，foo与bar有什么不同

{
  data: function() {
    return {
      foo: 'hellow'
    }
  },
  computed:  {
    bar: function() {
      return this.foo + ' world';
    }
  }
}