针对字节跳动的面试准备
字节跳动面经一
字节跳动面经二
字节跳动面经三
字节跳动面经四
从中选取题目整理解答
CSS
一个div垂直居中 其距离屏幕左右两边各10px 其高度始终是宽度的50%
div中有文本’A’ 其font—size:20px 文本水平垂直居中
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
*{
margin:0;
padding:0;
}
body,html{
width: 100%;
height: 100%;
}
.content{
width: 100%;
height: 100%;
position: relative;
background: red;
}
.box{
display: flex;
align-items: center;
justify-content: center;
width: calc(100vw - 20px);
height: calc(50vw - 10px);
font-size: 20px;
position: absolute;
top: 50%;
transform: translateY(-50%);
margin-left:10px;
background: yellow;
}
</style>
</head>
<body>
<div class="content">
<div class="box">A</div>
</div>
</body>
</html>
一个div里面有个span,span里有很多字,这时候给span加一个border显示
margin合并问题,解决方法?BFC和IFC的区别?
如何解决margin塌陷以及margin合并
深入理解BFC和IFC
chrome的字体最小为12px,如何设置10px的字体
使用transform:scale()属性进行缩放,注意最好在文字外套一个span,在span的css属性上增加transform,不然外元素的背景宽高都会有影响。
为什么设置font-weight是数字的时候作用会失效
因为有的字体没有提供特定粗细的字体。
JS
对函数式编程了解说一下 纯函数,偏应用,柯里化,compose 分别是什么
函数式编程入门教程
function add(num){
var sum=0;
sum= sum+num;
var tempFun=function(numB){
if(arguments.length===0){
return sum;
}else{
sum= sum+ numB;
return tempFun;
}
}
tempFun.valueOf=function(){
return sum;
}
tempFun.toString=function(){
return sum+'';
}
return tempFun;
}
if([]==false){console.log(1)};
if({}==false){console.log(2)};
if([]){console.log(3)}
if([1]==[1]){console.log(4)}
// 1 3
eventloop
async function a1 () {
console.log('a1 start')
await a2()
console.log('a1 end')
}
async function a2 () {
console.log('a2')
}
console.log('script start')
setTimeout(() => {
console.log('setTimeout')
}, 0)
Promise.resolve().then(() => {
console.log('promise1')
})
a1()
let promise2 = new Promise((resolve) => {
resolve('promise2.then')
console.log('promise2')
})
promise2.then((res) => {
console.log(res)
Promise.resolve().then(() => {
console.log('promise3')
})
})
console.log('script end')
script start
a1 start
a2
promise2
script end
// 此处开始执行异步队列
promise1
a1 end
promise2.then
promise3
// 执行完所有微任务才执行宏任务
setTimeout
闭包
闭包,是真的美
this
理解JS中的call、apply、bind方法
new
深入理解 new 操作符
原型链
JavaScript深入之从原型到原型链
ES6模块与CommonJS模块的差异
CommonJS和ES6模块化的区别以及如何解决让CommonJS导出的模块也能改变其内部变量
计网
CSRF 原理及防御
程序猿必读-防范CSRF跨站请求伪造
http 和 https 区别及建立连接的过程
HTTP 与 HTTPS 区别
- HTTP 明文传输,数据都是未加密的,安全性较差,HTTP(SSL+HTTP) 数据传输过程是加密的,安全性较好。
- 使用 HTTPS 协议需要到 CA(Certificate Authority,数字证书认证机构) 申请证书,一般免费证书较少,因而需要一定费用。证书颁发机构如:Symantec、Comodo、GoDaddy 和 GlobalSign 等。
- HTTP 页面响应速度比 HTTPS 快,主要是因为 HTTP 使用 TCP 三次握手建立连接,客户端和服务器需要交换 3 个包,而 HTTPS除了 TCP 的三个包,还要加上 ssl 握手需要的 9 个包,所以一共是 12 个包。
- http 和 https 使用的是完全不同的连接方式,用的端口也不一样,前者是 80,后者是 443。
- HTTPS 其实就是建构在 SSL/TLS 之上的 HTTP 协议,所以,要比较 HTTPS 比 HTTP 要更耗费服务器资源。
HTTPS 建立连接过程
-
首先客户端先给服务器发送一个请求
-
服务器发送一个SSL证书给客户端,内容包括:证书的发布机构、有效期、所有者、签名以及公钥
-
客户端对发来的公钥进行真伪校验,校验结果为真则使用公钥对对称加密算法以及对称密钥进行加密
-
服务器端使用私钥进行解密并使用对称密钥加密确认信息发送给客户端
-
随后客户端和服务端就使用对称密钥进行信息传输
缓存(讲了一下协商缓存的机制,简单请求和options预检请求)
算法的准备(数据结构与算法JavaScript)
最长子串(书上的源码有问题,网上很多人的版本也是照搬书上的)
function lcs(word1,word2) {
var max = 0;
var index = 0;
var lcsarr = new Array(word1.length + 1);
for (var i = 0; i <=word1.length + 1; i++) {
lcsarr[i] = new Array(word2.length + 1)
for (var j = 0; j <= word2.length+1; j++) {
lcsarr[i][j] = 0;
}
}
for (var i = 0; i <=word1.length; i++) {
for (var j = 0; j <= word2.length; j++) {
if (i == 0 || j == 0) {
lcsarr[i][j] = 0;
}else {
if (word1[i - 1] == word2[j - 1]) {
lcsarr[i][j] = lcsarr[i - 1][j - 1] + 1;
}else {
lcsarr[i][j] = 0;
}
}
if (max < lcsarr[i][j]) {
max = lcsarr[i][j];
index = i;
}
}
}
var str = "";
if (max == 0) {
return "";
}else{
for (var i = index - max; i < index; i++) {
str += word2[i];
}
return str;
}
}
顺时针打印矩阵
function printMatrix(matrix)
{
// write code here
if(matrix == null || matrix[0].length == 0){
return;
}
var row= matrix.length;
var column = matrix[0].length;
var start = 0;
var res = [];
while(column > start * 2 && row> start * 2){
var endx = column -1-start;
var endy = row-1-start;
//左到右一行
for(var i = start;i<=endx;i++){
res.push(matrix[start][i]);
}
//上到下一行
if(start < endy){
for(var i = start+1;i<=endy;i++){
res.push(matrix[i][endx])
}
}
//右到左
if(start < endx && start < endy){
for (var i = endx - 1; i >= start; i--) {
res.push(matrix[endy][i]);
}
}
//下到上
if (start < endx && start < endy - 1) {
for (var i = endy - 1; i >= start + 1; i--) {
res.push(matrix[i][start]);
}
}
start++;
}
return res;
}
一个长阶梯有n级,可以一次走1级,一次走2级,一共有多少种走法?
跳台阶
function jumpFloor(number)
{
if(number===0){
return 0;
}
else if(number===1){
return 1;
}
else if(number===2){
return 2;
}
else{
var pre = 1;
var cur = 2;
for(var i = 2;i<number;i++){
cur+=pre;
pre = cur-pre;
}
return cur;
}
}
function jumpFloorII(number){
return 1<<(number-1);
}
字典表
leetcode139
链表
手撕原理
instanceof 原理
function instanceof(left, right) {
const rightVal = right.prototype
const leftVal = left.__proto__
// 若找不到就到一直循环到父类型或祖类型
while(true) {
if (leftVal === null) {
return false
}
if (leftVal === rightVal) {
return true
}
leftVal = leftVal.__proto__ // 获取祖类型的__proto__
}
}
bind
Function.prototype.bind2 = function (context) {
if (typeof this !== "function") {
throw new Error("Function.prototype.bind - what is trying to be bound is not callable");
}
var self = this;
var args = Array.prototype.slice.call(arguments, 1);
var fNOP = function () {};
var fbound = function () {
self.apply(this instanceof self ? this : context, args.concat(Array.prototype.slice.call(arguments)));
}
fNOP.prototype = this.prototype;
fbound.prototype = new fNOP();
return fbound;
}