前端开发面试(一)

导读:今天面试字节跳动结果不是很理想,深刻的体会了自己的知识体系的不足,以及准备不充分,所以做一个总结,也是为以后面面试提供一些经验吧。

一、面试首先要掌握的一些知识点

以下是HR在面试前一天发给我的,跟面试时有一点点的出入:
需要对以下内容都有了解:
1.盒子模型/css布局/笔试水平居中的方法
2.闭包/GIT/浏览器循环机制
3.项目优化/This指向的问题
4.把秒时间戳改成2020-5-9 00:00显示
5.url的链接最后返回一个对象{a:1,b:2}的实现方法
6.写promise
7.关于es6的问题
8.关于js原生的问题
9.实现封装一个组件
10.将_转换为驼峰命名
11.深浅拷贝
12.vue和react的生命周期
13.写vue组件
14.call, apply, bind的区别
15.type of,axios, jsonp的相关知识
16.写一个todolist
17.写一个person类,里面需要有username和age,还有一个方法,还有代码的执行顺序

二、面试时

1、第一个问题:如何使一个宽高为100px的盒子在屏幕水平垂直居中?
我答的是使用 绝对定位将top值为50%、left值为50%这样就能将盒子垂直水平居中了;(由于昨天笔试的时候不注意。这里是否在中心点没看)
面试官说还需要添加一个值,反正最后我是磕磕巴巴的说还需要添加margin值,但是就是想不到要添加多少像素了
在这里插入图片描述
下面这个图就是在绝对定位的基础上添加一个margin-left:-50px;margin-top:-50px;

在这里插入图片描述

.box {
    
    
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -50px 0 0 -100px;
    width: 200px;
    height: 100px;
    background: red;
}

可参考链接:关于盒子的垂直水平居中

2、第二个问题什么是盒子模型?
答:

把所有的网页元素都看成一个盒子,它具有 content,padding,border,margin四个属性,这就是盒子模型

3、第三个问题 this的指向问题?
答:
默认绑定:全局环境中,this默认绑定到window.
隐式绑定:一般地,被直接对象所包含的函数调用时,也称为方法调用,this隐式绑定到该直接对象。
隐式丢失:隐式丢失是指被隐式绑定的函数丢 失绑定对象,从而默认绑定到window。
显式绑 定:通过call()、apply()、bind()方法把对象绑定到this上,叫做显式绑定。
new绑定:如果函数或者方法调用之前带有关 键字new,它就构成构造函数调用。对于this绑 定来说,称为new绑定

4、第四个问题call()、apply()有什么区别?
答:更简单地说,apply和call功能一样,只是传入的参数列表形式不同也就是说:call调用的为单个,apply调用的参数为数组

5、第五个问题用ES6里面的class写一个person类,里面需要有username和age

class Person
{
    
    
private String name;
private int age;
public Person(String name, int age)
{
    
    
this.name = name;
this.age = age;
}
public String toString()
{
    
    
return "Person[Name:" + name +", Age" + age + "]";
}
}

6、打印结果是多少?

window.a = 1;
function foo() {
    
    
var b = 2;
console.log(b + this.a);
console.log(b + a);
}
function foo1() {
    
    
var a = 4;
foo();
}
foo1();

结果:3、3

7、打印的顺序

console.log('begin')
setTimeout(()=>{
    
    
console.log('setTimeout')
},0)
new Promise(resolve=>{
    
    
console.log('Promise')
})
console.log('end')

结果为 begin、promise、end、setTimeout
由于settimeout为异步任务,需让主线任务执行完成后再来执行

7、vue的计算属性是什么?
由于我想不起来了。面试官就说跳过下一下,这就尴尬了。
答案:1.首先vue的计算属性是computer,它是实时响应的,计算属性会依赖于他使用的data中的属性,只要是依赖的属性值有改变,则自动重新调用一下计算属性
2.如果它所依赖的属性值没有发生改变,那么计算属性是从它的缓存中来的,并没有重新编译

8、vue的watch是什么?
我答的不是很准确,到这里就知道凉凉了,面试官说 下次准备好了再来投递吧。那么这次面试就到这里吧。。。。
答案:一个对象,键是需要观察的表达式,值是对应回调函数。值也可以是方法名,或者包含选项的对象。Vue 实例将会在实例化时调用 $watch(),遍历 watch 对象的每一个属性。
扩展
watch和computer的区别在哪里?
watch是监听一个变量或者常量的变化,computer可以监听多个变量

斜体样式今天就先写到这里吧 ,后面会专门开一栏来写面试的,也欢迎大家都来交流交流

猜你喜欢

转载自blog.csdn.net/weixin_45054614/article/details/112895032