当前位置:   article > 正文

字节三面 面试总结记录_斜45度打印二维矩阵

斜45度打印二维矩阵

1. 实习的项目相关

2. async 使用 及一些概念

基本的使用方法:

  1. async函数返回一个promise对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回
  2. 等到异步操作完成,再接着执行函数体内后面的语句

例子:指定多少毫秒后输出一个值

function timer(ms) {
    return new Promise(resolve=> {
        setTimeout(resolve,ms)
    })
}

async function asyncPrint(value, ms) {
    await timer(ms)
    console.log(value)
}

async('hello wold',50)
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

await

  1. 正常情况下 await命令后面时一个Promise对象,返回该对象的结果
  2. 如果不是promise对象,就直接返回对应的值
async function async1() {

   console.log('async1 start');   1

   await async2();

   console.log('async1 end'); 

}

async function async2() {

   console.log('async2');    1

}

console.log('script start');  1

setTimeout(function() {

     console.log('setTimeout');  1

}, 0);  

async1();

new Promise(function(resolve) {

    console.log('promise1');  1

    resolve();

 }).then(function() {

    console.log('promise2');  1

});

console.log('script end');  1
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39

事件循环:
首先执行同步代码,进入执行栈
执行过程中遇到异步就就放入消息队列中
消息队列有微任务和宏任务

  • 首先执行同步代码 script start async1 start async2 promise1 script end async1 end promise2 setTimeout’

3. 输入url到页面展示的过程

网络请求:

  1. 构建请求
    请求方法 地址 版本
  2. 查找强缓存
    如果命中 直接使用 否则进行下一步
  3. DNS解析
    我们输入的是域名,但是数据包是以ip地址传给对方的。

因此我们需要得到域名对应的ip地址

这个过程需要依赖一个服务系统,将域名和ip一一对应

DNS(域名系统)

得到具体的ip过程就叫DNS解析

如果一个域名已经解析过来,那么解析后的结果会被缓存下来

下次处理就可以直接走缓存 不需要经过DNS解析

  1. 建立tcp链接
    chrome在同一个域名下要求同时最多只能由6个tcp链接,超过的话需要等待。

如果不需要等待,就会进入tcp连接阶段

  • tcp 是一种面向连接,可靠的,基于字节流的传输层通信协议

  • tcp三次握手

  1. 发送http请求
  • 请求行 请求方法 请求url 请求版本
  • 请求头 Cache-Control、If-Modified-Since、If-None-Match
  • 请求体 请求体只有在POST方法下存在,常见的场景是表单提交。

网络响应

  1. http响应
  • 响应行
    HTTP/1.1 200 OK
    HTTP协议版本、状态码和状态描述
  • 响应头
    服务器生成数据的时间、返回的数据类型以及对即将写入的Cookie信息。

Connection: Keep-Alive,表示建立了持久连接,这样TCP连接会一直保持,之后请求统一站点的资源会复用这个连接。

浏览器的解析部分

  1. 构建DOM树
    词法分析和语法分析

  2. 样式计算
    link标签引用
    style标签中的样式
    元素的内嵌style属性

  • 格式化样式表
  • 标准化样式属性
    em->px,red->#ff0000,bold->700
  • 计算每个节点的具体样式
  1. 生成布局树
  • 遍历生成的DOM树节点,并把他们添加到布局树中
  • 计算布局树节点的坐标位置

这棵布局树值包含可见元素,对于 head标签和设置了display: none的元素,将不会被放入其中。

浏览器的渲染

  • 建立图层树
  • 生成绘制列表
  • 生成图块并栅格化
  • 显示器显示内容

4. 斜45度打印二维矩阵

差不多是这个

onDecrypt([
    ["今","天","上","一","新","影"],
    ["晚","我","起","上","《","》"],
    ["们","去","映","流","好","听"],
    ["看","的","浪","不","小","非"],
    ["电","地","好","李","常","得"],
    ["球","?","说","值","看","!"]
  ])

将上面代码,按一定顺序打印成完整一句话,运行结果:

‘今天晚上我们一起去看新上映的电影《流浪地球》好不好?听小李说非常值得看!’
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
function onDecrypt(arr) {
    let str = '';
    let len = arr.length;
    let r = 0, c = 0;

    for (let i = 0; i < len; i++) {
        for (r = 0, c = i; r <= i && c >= 0; r++, c--) {
            str += arr[r][c]
        }
    }

    for (let i = 1; i < len; i++) {
        for (r = i, c = len - 1; r <= len - 1&& c >= i; r++, c--) {
            str += arr[r][c]
        }
    }
    return str
}

console.log(onDecrypt(arr))

// 今天晚上我们一起去看新上映的电影《流浪地球》好不好?听小李说非常值得看!
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
声明:本文内容由网友自发贡献,转载请注明出处:【wpsshop】
推荐阅读
相关标签
  

闽ICP备14008679号