【秋招_前端_题目记录】流水账式记录

2020.09.09 美团一面

1.自我介绍、项目介绍
2.垂直居中的方式
3.position属性以及含义(sticky卡住了)
4.移动端响应式布局的方式？rem, 原理？缺陷？根元素的font-size属性不一致会有什么问题(设备差异比较大的时候会存在)
5.移动端1px问题？(设置了1px，实际上不是1px)
6.this指向
7.call bind apply区别
8.react点击事件中的this用到了bind，为什么
9.flex弹性布局
10.引用类型和非引用类型的区别
11.let和const区别
12.如何判断对象类型，项目中用到了哪个
13.数组中的every函数 (有一个不符合就会返回false)
14.React生命周期
15.PureComponent
16.Promise，如果想在catch之后继续执行then，应该怎样做(Promise.resolve)；Promise.all返回什么？数组
17.设计题：设计一个弹窗实现，尽可能全面，适用于比较多的业务场景

2020.09.11 搜狗一面
1.自我介绍、项目介绍
2.浏览器同源策略
3.跨域
4.img标签有没有跨域的问题，img的src请求地址是不同域，src请求返回一张图片
5.防抖和节流
6.position
7.react生命周期，getDerivedStatefromProps返回值是什么
8.react hooks如何模仿componentDidMount，传一个[]
9.通过setState主动更新state，生命周期触发流程
10.说一下react hooks，useRef使用场景，useMemo和useEffect区别(依赖发生变化才会触发，没觉得有区别，说下不同的使用场景)
11.实现一个需求，封装原生的输入框，根据输入向服务器发送请求，给出提示内容
对比用户输入前后的内容，发生变化则发出请求；
通过xmlHttpRequest发送请求，描述了一个怎么发送xmlHttpRequest的过程

2020.09.12 美团二面
1.自我介绍
2.webpack打包构建配置用的多吗
3.自己对哪一块了解比较深入
4.vue的原理了解哪些，双向绑定(data->dom, dom->data)，nextTick
5.写一个发布-订阅模式
6.react hooks原理
7.react中父子组件传值的方式，props和事件，兄弟组件，非同级组件？
8.vue生命周期，父子组件生命周期
9.跨域方法，cors简单请求和非简单请求，option请求
10.http状态码, 504, 502
11.有一堆散点，数据量很大，知道点的坐标，还有一个圆，知道圆的半径和圆心坐标，怎么判断圆是不是在半径内？优化？

2020.09.15 快手一面
1.自我介绍

用reduce实现map

Array.prototype.reduceMap = function(cb){
    return this.reduce((prev, cur)=>{
        prev.push(cb(cur))
        return prev;
    },[])
}

判断输出

async function async1() {
console.log('async1 start');
await async2();
console.log('async1 end');
}

async function async2() {
console.log('async2');
}

console.log('script start');

setTimeout(() => {
console.log('setTimeout');
}, 0);

async1();

new Promise((resolve) => {
console.log('promise1');
resolve();
}).then(() => {
console.log('promise2');
}).then(() => {
console.log('promise3');
});;

console.log('script end');

最后算法题
Leetcode1-2sum （空间换时间）

粉笔教育 2020.09.15
一面

判断输出

a = 123
function foo(){
console.log(a)
}
function far(){
a = 456;
foo()
}
far()

var a = 123
function foo(){
console.log(a) // foo()定义在全局环境中，找a的时候会在全局范围内找
}
function far(){
var a = 456;
foo()
}
far()

参考
严格模式（全局变量显式声明）
http://www.ruanyifeng.com/blog/2013/01/javascript_strict_mode.html

三面
服务端推送的原理？
https://www.runoob.com/html/html5-websocket.html

2020.09.16 松果出行一面
1.自我介绍
2.项目介绍、难点
3.0.1+0.2不等于0.3的问题
Js以浮点数的形式保存数值，计算时数值被转为二进制，浮点数用二进制表达时是无穷的，IEEE754标准的64位双精度浮点数的小数部分最多支持53位二进制位，两者相加之后，由于数位限制而截断二进制数字，最后转为10进制时就出现了误差
https://www.cnblogs.com/qiuxiaozhen/p/10505651.html

2020.09.18 猿辅导一面
1.自我介绍、项目介绍、难点(技术+业务)
2.node.js跟浏览器中的时间循环有什么不同，node.js的高并发？
3.settimeout跟raf不同，实现？
4.用generator/promise实现一个koa中间件, 每次请求开始和结束时打印请求响应时间? 用async/await书写
5.箭头函数跟普通函数的this, arguments对象不能使用不是箭头函数规定的，是严格模式规定的
6.说下严格模式规定的内容有啥，说两个
7.缓存策略，强制缓存状态码，协商缓存状态码(304缓存有效，200缓存失效，通过ETag字段对比)
8.事件委托是什么
9.说下跨域(jsonp, cors, nginx, postmessage)，说下PostMessage怎么实现
10.rem和em（em是相对自身的）
11.实现一个retry函数
api() return promise
Function retry(api, count){}

2020.09.18 smartX二面
1.开发过程中遇到的有意思的事情
2.找工作的期望
3.说下selenium webdriver，你觉得你写的测试用例稳定吗，有没有一些涉及到异步的操作
selenium原理：https://blog.csdn.net/yoyocat915/article/details/80246744
4.webdriver实现原理有没有了解过(没有。。，不同的浏览器有不同的实现，是浏览器对外提供了一个对外api，通过端口封装实现这个api？)
5.vue和react对比，哪个设计的比较好的例子 (举了vue生命周期和react hooks的对比)
6.useState是怎么知道哪个state发生变化的(内部实现用了一个队列)
7.koa中webserver的实现，如果在处理用户发送的请求的过程中更新服务器代码，那么用户请求会被终止，怎么避免这种情况发生？(自己维护一个map，请求发送过来就加入，处理完毕就删掉，然后劫持process的信号，进行监听，当更新之前首先清空队列，之后再更新)

2020.09.19 爱奇艺一面
1.给一个DOM结构，实现getElementById方法
2.写一个防抖
3.实现单链表逆转
4.react hook解决的问题
5.说下闭包，判断输出

var name = 'a';
function foo(){
    console.log(name)
}

var obj = {
    name: 'obj',
    far: function(){
        foo();
    }
}

obj.far();

6.new的过程发生了什么,在new中有返回值，那么会返回什么(只有在返回类型是引用类型时，才会覆盖实例)

function Person() {
    this.name = name;
    // return null; 
    // return "abc";
    // return {
    //     foo: 'hello, you'
    // }
    return function(){}
}

var p = new Person();

7.css优先级，权重
8.css渲染顺序，从左到右还是从右到左，为什么？

2020.09.19 爱奇艺二面
1.说下原型
Object.prototype
Function.prototype
Array.prototype

2.判断输出

var obj = Object.create({a: 2})
obj.a
obj.__proto__.a

2020.09.21 小米一面
1.css2和css3都用过吗，说下盒模型
2.BFC
3.项目中使用什么布局，flex，那flex:1什么意思，怎么分配(问的很详细)
4.用es5实现一个继承(写了一个组合继承)
5.原型链
6.ES6的新特性用过哪些
7.promise.all的具体实现
8.深拷贝
9.在数组中找到一个比当前数字大的最小数字

function getNext(arr, num) {
    let l = arr.length;
    if (l < 1) return -1;
    arr.sort((a, b) => b-a);
    
    let index = arr.indexOf(num)
    if (index === -1) {
        let dif = Number.MAX_SAFE_INTEGER, res = -1;
        for(let i = 0; i < l; i++) {
            if (arr[i] > num) {
                let tmp = arr[i] - num;
                if (tmp < dif) {
                    dif = tmp;
                    res = i;
                }
            }
        }
        return res;
    } else {
        if (index === l - 1) {
            return -1;
        } else {
            return index+1;
        }
    }
}

移动研究院一面 2020.09.22
1.设计一个tab组件
2.如何获取到li的索引

<div style="width: 400px;height: 400px;border: 1px solid black;">
        <ul id="p">
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    </div>
    <script>
        let el = document.getElementById('p');
        let els = document.getElementsByTagName('li');
        for(let i = 0; i < els.length; i++){
            els[i].onclick = function(){
                console.log(i)
            }
        }
    </script>

3.ES6新对象
4.数组和Set区别、转化

滴滴一面 2020.09.23
1.项目
2.let obj = {a, b, c, d, e, ...}，怎么接收obj中去掉某几项之后的对象内容（对象解构、剩余参数）

滴滴二面
项目

滴滴三面
1.自我介绍
2.算法1：删除数组中出现次数最少的数字
3.算法2：数字转为中文读法，比如123456->十二万三千四百五十六，数字不超过1000亿

便利蜂一面 2020.09.24
1.笔试题回顾
2.let, const区别, Map用法，map怎么转为对象
3.斐波那契数列，计算多少个第一项第二项
4.react传递数据的方式（从一个页面打开一个页面、如果两个页面都处于打开状态怎么传递数据）

58同城一面 2020.09.24
1.自我介绍
2.css盒模型和bfc区别
3.js原型链，原型链的好处是啥（可以挂载一些通用的属性、方法）
4.es6语法常用哪些
5.es6怎么转es5(抽象语法树)，还有哪里用到了AST（v8引擎解析js代码）提示react
6.typescript使用遇到什么问题
7.react hook的好处？函数式编程
8.优化项目
9.父组件变化，怎么避免子组件不必要的更新

转转一面 2020.09.24
1.左右布局的实现
2.display:none和visibility:hidden区别，如何实现自身元素隐藏，子孙元素呈现？
3.box-sizing
4.css预处理，好处
5.如何判断一个数组，有哪些方法
6.实现一个instanceof, new的过程发生了什么
7.浏览器事件循环
8.promise有几种状态，实现一个promise.race
9.数组去重的方法
10.react hooks的好处，使用有哪些规则，用到过哪些hook
11.vue的双向绑定，vue2.0有什么缺陷，3.0的改进
12.v-model原理
13.虚拟DOM，好处，缺陷

转转二面 2020.09.24
1.项目难点
2.三列布局的实现(flex, 浮动,相对定位、绝对定位、table、grid)
3.实现一个动画：一个气泡从下向上升起，慢慢消失，重复这个过程 (transform: translate, animation: show 3s infinite)
4.箭头函数跟普通函数的区别，使用场景，哪些场景不能用箭头函数，除了yield ???
5.比较一个对象是否相等，怎么判断, 如果是一个function怎么判断是否相等
6.懒加载怎么实现，scroll应该用防抖还是节流，感觉没讲清楚
参考：https://blog.csdn.net/hupian1989/article/details/80920324
防抖：不断触发操作，最终只会执行一次
节流：不断触发操作，在每一次操作之后的n秒之后都会执行一次
7.ES6语法
8.react通信方式（父子、兄弟、不同层级）

好未来一面 2020.09.25
1.作用域有哪些
2.let, var
3.es6
4.promise
5.集合Set
6.说下数据结构有哪些
7.进程和线程，JS为什么是单线程
8.浏览器渲染DOM的过程
9.async defer
10.git 操作，有两个commit，只想push其中一个怎么办；代码合进去发现有问题，怎么办；revert掉之后又让合进去，怎么办
11.新技术探索
12.怎么面对压力

好未来二面 2020.09.25
问了好多好多

好未来HR面 2020.09.25
1.。。。

京东一面 2020.09.25
1.闭包
2.防抖
3.ES6
4.promise
5.强制缓存 命中会怎样，不命中会怎样；协商缓存字段
6.简单请求，非简单请求在跨域时会发送几次，跨域可以携带cookie吗
7.node中的常用函数，path.join()怎么用
8.遍历有哪些，for in, for of, forEach, for
9.react-router传参方式
10.webpack配置过哪些

电信云一面 2020.09.25
1.自我介绍，为啥考研
2.react生命周期，父子组件生命周期（创建和销毁）
3.js事件循环，队列和数组
4.怎么判断资源是否加载完毕，包括图片、视频、音频
5.浏览器同源策略，跨域策略
6.js怎么实现一个私有方法
7.ES6新特性, 为什么要用 let
8.防抖和节流怎么实现，setTimeout时间准确吗，最小时间间隔是多少，4ms，为什么是4ms
9.项目难点

58同城二面 2020.09.25
1.项目，怎么上线，过程发生了什么；项目页面根据什么拆分
2.难点，技术点，64位是几个字节
3.浏览器缓存策略，http缓存（静态资源缓存）；强缓存已经生效，但是服务端资源更新了，客户端怎么触发更新获取新资源
4.算法题，简单的正则

转转HR面 2020.09.25

百度一二三面 2020.09.26
一面 会问很多细节
1.自我介绍
2.position属性
3.怎样用position实现元素覆盖；如果有两个元素A和B，分别有一个子元素，如何让A的子元素盖住B的子元素
4.浏览器同源，触发跨域的操作；iframe，怎么解决
5.非简单请求是什么，反向代理的原理,JSONP怎么实现
6.var, let, const
7.Promise具体实现，resolve, reject怎么实现的
8.bfs, dfs, 实现一个bfs
9.节流和防抖，选一个实现，防抖添加heading和tailing(触发时执行一次，到达时间执行一次，最后执行一次)

二面 比较多的判断输出
记不清楚原题，写个大概
1.判断输出

var name = 'global'
function  a() {
    console.log(name)
}

function b(){
    var name = 'b';
    a();
}

b();

function a(){
    console.log('1');
}

a();
function a(){
    console.log('2');
}
a();

// ************
var a = function(){
    console.log('1');
}

a();
var a = function(){
    console.log('2');
}
a();

// ********
var name = 'global'
function a(){
    console.log(name);
}
a();

function b(){
    var name = 'b';
    function a(){
        console.log(name);
    }
    a();
}

// *******
var name = 'global'
function a(){
    console.log(this.name);
}
a();

function b(){
    var name = 'b';
    function a(){
        console.log(this.name);
    }
    a();
}

// ***
function a(){
    console.log('a')
    b();
    console.log('a end')
}

function b(){
    console.log('b');
    c();
    console.log('b end')
}

function c(){
    console.log('c');
}

a();

2.事件冒泡和捕获，点击div3，输出什么

<!DOCTYPE html>
<html>
    <title>Document</title>
    <head></head>
    <body>
        <div id="d1">
            div1
            <div id="d2">
                div2
                <div id="d3">
                    div3
                    <div id="d4">
                        div4
                    </div>
                </div>
            </div>
        </div>
        <script>
            document.getElementById('d1').addEventListener('click', function(){
                console.log('div1 capture')
            }, true)
            document.getElementById('d1').addEventListener('click', function(){
                console.log('div1 bubble')
            }, false)
            document.getElementById('d2').addEventListener('click', function(){
                console.log('div2 capture')
            }, true)
            document.getElementById('d2').addEventListener('click', function(){
                console.log('div2 bubble')
            }, false)
            document.getElementById('d3').addEventListener('click', function(){
                console.log('div3 capture')
            }, true)
            document.getElementById('d3').addEventListener('click', function(){
                console.log('div3 bubble')
            }, false)
            document.getElementById('d4').addEventListener('click', function(){
                console.log('div4 capture')
            }, true)
            document.getElementById('d4').addEventListener('click', function(){
                console.log('div4 bubble')
            }, false)
        </script>
    </body>
</html>

三面 考察个人素质方面，没有技术考察

龙湖科技一二三面 2020.09.26
重点：Vue和React的对比，优缺点
一面二面三面
1.自我介绍
2.项目优化、数据结构，红黑树了解吗，B树，B+树，map的实现，时间复杂度
3.vue跟react的不同，优缺点
4.快排怎么实现，发布-订阅模式怎么实现
5.项目难点
6.职业规划

美团HR面 2020.09.26
常规问题#秋招##面经##百度##美团##前端工程师#