【用友金融】前端面试题总结

回流与重绘

下列关于回流和重绘的说法错误的是

• 回流的性能开销大于重绘的性能开销

• 当页面结构、尺寸等改变时会发生回流

• 回流一定会引起重绘，重绘也一定会引起回流(x)

• 当页面结构不改变只是样式发生改变时会发生重绘，例如背景颜色改变时会发生重绘

• display: none 指的是元素完全不陈列出来，不占据空间，涉及到了DOM结构，故产生reflow与repaint

• visibility: hidden 指的是元素不可见但存在，保留空间，不影响结构，故只产生repaint，但不可触发绑定事件

• opacity: 0 指的是元素不可见但存在，保留空间，不影响结构，并且，如果该元素已经绑定一些事件，如click事件，那么点击该区域，也能触发点击事件的

CSS属性

下列选项中哪个描述对于visibility: hidden;与display: none;是正确的

• visibility属性不可继承
• visibility: hidden; 不占据页面空间
• display: none; 不占据页面空间(√)
• 都无法通过DOM交互

函数执行结果

题目1

(function () {
  var a = (b = 5);
})();

console.log(b);
console.log(a);

结果为：

5
Error

题目2

console.log(1 + '2')
console.log(1 - '2')

结果为：

12
-1

题目3

var a = 1

setTimeout(function () {
  a = 2
  console.log(a)
}, 0)

var a
console.log(a)

a = 3
console.log(a)

结果为：

1
3
2

题目4

function f() {
  return f
}

console.log(new f() instanceof f)

结果为：

false

题目5

var foo = {
  bar: function () {
    return this.baz
  },
  baz: 1
}

console.log(typeof (f = foo.bar)())

结果为：

undefined

题目6

var a = (b = 1, c = 2)
console.log(a, b, c)

结果为：

2 1 2

题目7

var company = {
  address: 'beijing'
}

var jjworld = Object.create(company)
delete jjworld.address
console.log(jjworld.address)

结果为：

beijing

题目8

function side(arr) {
  arr[0] = arr[2]
}

function a(a, b, c = 3) {
  c = 10
  side(arguments)
  return a + b + c
}

console.log(a(1, 1, 1))

结果为：

12

CSS权重的优先级

内联样式 > ID选择器 > 类选择器 > 标签选择器 > 通配符

HTTP状态码

越多越好

• 400 临时重定向
• 500 服务器内部错误
• 404 服务器无法找到对应资源
• 200 请求正常处理

BFC(块级格式上下文)

下列选项对产生BFC描述错误的是：

• overflow为visible(x)
• position为absolute
• display为table-cell
• float属性不为none

元素浮动

设置元素浮动后，元素的display值哪个是正确的？

• inline-block
• float
• inline
• block(√)

HTTP请求方法

下面哪个选项不是HTTP的请求方法

• HEAD
• PUT
• OPTIONS
• PUSH(x)

HTTP请求方法有：

GET POST DELETE PUT OPTIONSCONNECT HEAD PATCH TRACE

跨域问题

通常有哪些方法解决跨域问题？

• 利用JSONP
• 反向代理
• 服务器配置CORS

了解Webpack的哪些配置项

• resolve.alias 为路径设置别名
• resolve.extensionAlias 后缀省略时 按此顺序指定的后缀名解析文件
• module.rules 包含test loader option 正则匹配后缀名 使用指定的loader解析文件

判断变量类型

直接使用typeof无法判断引用类型变量的类型

console.log(typeof []) // object
console.log(typeof {}) // object
console.log(typeof null) // object

JS浮点数相加精度问题

简单讲讲Vue Router原理

ES6熟悉吗

ES6教程

• let const
• 解构赋值 扩展运算符 可选链
• Promise Async
• Class Set Map Symbol Proxy

CSS如何实现水平居中与垂直居中

参见CSS学习笔记