Skip to main content

http2 和 http1 的区别

  • 二进制分帧

  • 头部压缩:使用 HPACKHTTP/2 头部压缩

  • 服务器推送

  • 多路复用:最重要的特点,(MultiPlexing),即连接共享,即每一个 request 都是是用作连接共享机制的。一个 request 对应一个 id,这样一个连接上可以有多个 request,每个连接的 request 可以随机的混杂在一起,接收方可以根据 requestidrequest 再归属到各自不同的服务端请求里面。

    多个请求可同时在一个连接上并行执行(由于支持二进制的格式,可以无序)某个请求任务耗时严重,不会影响到其它连接的正常执行

更多请见:HTTP 的前世今生

HTTPS 和 HTTP 区别

  • https 协议需要到 CA 申请证书,一般免费证书较少,因而需要一定费用
  • http 是超文本传输协议,信息是明文传输,https 则是具有安全性的 ssl/tls 加密传输协议。
  • httphttps 使用的是完全不同的连接方式,用的端口也不一样,前者是 80, 后者是 443
  • http 的连接很简单,是无状态的;https 协议是由 SSL/TLS+HTTP 协议构建的可进行加密传输、身份认证的网络协议,比 http 协议安全

meta 元素都有什么

meta 元素定义的元数据的类型包括以下几种:

  • 如果设置了 name 属性,meta 元素提供的是文档级别(document-level)的元数据,应用于整个页面。
  • 如果设置了 http-equiv 属性,meta 元素则是编译指令,提供的信息与类似命名的 HTTP 头部相同。
  • 如果设置了 charset 属性,meta 元素是一个字符集声明,告诉文档使用哪种字符编码。
  • 如果设置了 itemprop 属性,meta 元素提供用户定义的元数据。

react hooks

react hooks#

它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。

  • 使用 state
  • 状态逻辑复用

它出现的动机更多的还是说在组件之间复用状态逻辑很难,纵然我们已有高阶组件,render props 可以去做这样的事情,但二者或多或少多存在一些问题

例如,高阶组件在做逻辑复用时

  • 无法清晰的标识数据的来源
  • props 可能会被覆盖

而 render props 则很容易导致

  • 嵌套地狱

所以说 react hooks 的出现更多的是解决了状态逻辑复用的完整性

更多钩子函数请前往 Hooks

react redux

react redux#

首先要明白 redux 是 JavaScript 应用程序的可预测状态管理工具,其本身与 react 无关,react - redux 将它们两联系起来的

而学习 react redux 需先明白 redux 的工作原理。Redux 是一个经典的发布订阅器它帮我们用一个变量存储所有的 State,并且提供了发布功能来修改数据,以及订阅功能来触发回调(但是回调之后干嘛?自己解决)。

  1. 首先明确与 React 产生关联的是 React-Redux 这个库

  2. Redux 的原理就是一个发布订阅器,帮我们用一个变量存储所有的 State,并且提供了发布功能来修改数据,以及订阅功能来触发回调

  3. 而 React-Redux 的作用就是订阅 Store 里数据的更新,他包含两个重要元素,Provider 和 connect 方法

  4. Provider 的作用就是通过 Context API Store 对象注入到 React 组件上去

  5. 而 connect 方法就是一个高阶组件,在高阶组件里通过订阅 Store 中数据的更新,从而通过调用 setState 方法来触发组件更新

更多使用请见:redux

react-router

react router#

react router 期望在不刷新页面的情况下,根据不同的路径展示不同的组件

react router 的三个核心组件即

  • 路由器: BrowserRouter 和 HashRouter
  • 路由匹配器:Switch 和 Route
  • 路由导航:Link、NavLink 和 Redirect

使用的话大家自行发挥就好

不完全的二叉树的倒置

题目描述:

假设有一棵树二叉树,我们需要将其左子树全部转化为右子树。(对于每一个子节点,都需要转化)

树形结构如下:

/**
* Definition for a binary tree node.
* function TreeNode(val, left, right) {
* this.val = (val===undefined ? 0 : val)
* this.left = (left===undefined ? null : left)
* this.right = (right===undefined ? null : right)
* }
*/
/**

题目解析:

这道题重点在于遍历树,并且在遍历的情况下,需要交换两个子树,所以不能采用 DFS 深度遍历。遍历方法有很多种,这里给出的解决方案为其中的一种。

样例代码:

const treeReBuild(tree: TreeNode){
if(tree === null){
return
}
let temp = tree.right
tree.right = tree.left
tree.left = temp
treeReBuild(tree.left)
treeReBuild(tree.right)
}

为什么 JS 要设置为单线程

JavaScript 之所以为单线程跟其用途有关,JavaScript 的主要用途是与用户互动,以及操作 DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。比如,假定 JavaScript 同时有两个线程,一个线程在某个 DOM 节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准?

所以,为了避免复杂性,从一诞生,JavaScript 就是单线程,这已经成了这门语言的核心特征,将来也不会改变。