No26.精选前端面试题,享受每天的挑战和学习

简介: No26.精选前端面试题,享受每天的挑战和学习

axios.get()到底做了什么?

axios.get() 是使用 Axios 库发起 GET 请求的方法。当调用 axios.get(url) 时,它会执行以下操作:

  1. 创建一个 HTTP GET 请求:根据提供的 url 参数,创建一个 HTTP GET 请求对象。
  2. 发送请求:使用该请求对象向指定的 url 发送 GET 请求。
  3. 接收响应:等待服务器响应,并接收返回的数据。
  4. 处理响应:根据响应状态码和响应数据,执行相应的操作。

具体而言,axios.get() 方法会执行以下过程:

  • 封装请求参数:将 GET 请求所需的参数(如 URL、请求头、查询参数等)封装成一个请求对象。
  • 发送请求:通过浏览器的 XMLHttpRequest 或者 Node.js 的 http 模块,发送 HTTP GET 请求到指定的 url
  • 处理响应:一旦服务器响应返回,axios.get() 会根据响应状态码来决定请求是成功还是失败。如果是成功的响应(状态码在 200-299 范围内),则会将响应数据解析并传递给调用者。如果是失败的响应,可能会触发错误处理(例如网络错误、请求超时等)。
  • 返回响应数据:axios.get() 最终会返回一个 Promise 对象,该 Promise 对象的值是包含响应数据的 Axios Response 对象。可以通过对该对象的操作来访问响应数据、状态码和其他相关信息。

总的来说,axios.get() 方法帮助我们简化了发起 HTTP GET 请求的过程。它封装了底层的网络请求细节,并提供了便捷的 API 来处理响应数据。

JavaScript 如何对 JSON 数据进行冒泡排序?

要对 JSON 数据进行冒泡排序,需要按照指定的字段比较并交换 JSON 对象的位置。以下是一个示例代码,演示了如何使用 JavaScript 对 JSON 数组进行冒泡排序:

// 定义一个 JSON 数组
var jsonArr = [
  { name: "Alice", age: 25 },
  { name: "Bob", age: 18 },
  { name: "Charlie", age: 30 },
  // ... 其他 JSON 对象
];
// 冒泡排序函数
function bubbleSort(arr, field) {
  var len = arr.length;
  for (var i = 0; i < len - 1; i++) {
    for (var j = 0; j < len - 1 - i; j++) {
      // 比较两个 JSON 对象的字段,并交换位置
      if (arr[j][field] > arr[j + 1][field]) {
        var temp = arr[j];
        arr[j] = arr[j + 1];
        arr[j + 1] = temp;
      }
    }
  }
}
// 调用冒泡排序函数,按照 age 字段对 JSON 数组进行排序
bubbleSort(jsonArr, "age");
// 打印排序后的结果
console.log(jsonArr);

在上述代码中,我们定义了一个名为 bubbleSort 的函数,用于执行冒泡排序。该函数接受两个参数:待排序的 JSON 数组 arr 和用于比较的字段 field。在嵌套的循环中,我们比较相邻两个 JSON 对象的 field 字段,并根据需要交换它们的位置。

最后,我们使用示例数据调用了 bubbleSort 函数,并将字段名 "age" 传递给它。排序完成后,我们打印了排序后的 JSON 数组。

请根据实际需求修改代码中的字段和数据,以便适应您的情况。

http加密原理

HTTP 加密使用的主要技术是 SSL(Secure Sockets Layer,安全套接层)和其继任者 TLS(Transport Layer Security,传输层安全)。这些协议提供了在客户端和服务器之间进行加密通信的机制。

以下是 HTTP 加密的工作原理:

1. 握手阶段 (Handshake)

  • 客户端发起请求:客户端发送一个加密连接请求到服务器,并指明支持的加密算法和协议版本。
  • 服务器响应:服务器收到请求后,选择与客户端兼容的加密算法和协议版本,并发送证书给客户端。证书包含服务器的公钥、证书颁发机构的信息以及其他验证信息。
  • 客户端验证证书:客户端使用预装的根证书或者受信任的证书颁发机构的公钥,对服务器证书的合法性进行验证。如果证书有效,则客户端生成一串随机数,用服务器的公钥进行加密,并发送给服务器。

2. 密钥交换阶段 (Key Exchange)

  • 服务器解密客户端发来的随机数:服务器使用自己的私钥解密客户端发来的加密随机数。
  • 生成会话密钥:服务器使用客户端和自己的随机数,生成一个对称的会话密钥,以供后续的数据加密和解密使用。

3. 数据传输阶段

  • 加密通讯:客户端和服务器使用会话密钥对数据进行加密和解密,以保证在网络中传输的数据的安全性。
  • 完整性校验:在加密后的数据中包含校验码,用于验证数据的完整性,以防止数据在传输过程中被篡改。

使用 SSL/TLS 协议进行 HTTP 加密,可以保护数据在传输过程中的机密性、完整性和身份验证等。这种方式广泛应用于保护网上银行、电子商务、个人隐私等敏感信息的传输。

Vue 的响应式中的三个构造器:Observe、Watcher、Dep

Vue.js 的响应式系统主要由三个构造器组成:Observer(观察者)、Watcher(观察者订阅者)和 Dep(依赖管理器)。

1. Observer(观察者)

Observer 用于将一个普通的 JavaScript 对象转换为具有响应式能力的对象

它通过递归遍历对象的所有属性,使用 Object.defineProperty() 方法为每个属性设置 gettersetter,以便在该属性被访问或修改时触发相应的行为。

这样一来,当属性发生变化时,就能够通知到依赖于该属性的 Watcher

2. Watcher(观察者订阅者)

Watcher 是一个中介角色,它会依赖于被观察的对象的某个属性

每当该属性发生变化时,Watcher 接收到通知并执行相应的回调函数。

一个 Watcher 实例通常与模板中的表达式、指令或计算属性相关联,它会订阅所依赖的数据源,并在数据变化时执行相应操作。

3. Dep(依赖管理器)

Dep 负责管理 Watcher 和观察者之间的关系

每个被观察的属性都会对应一个 Dep 实例。

当观察者订阅属性时,Dep 会将该观察者添加到自己的订阅列表中。

当属性发生变化时,Dep 会通知所有订阅者(即 Watcher)进行更新操作。

这三个构造器共同工作,实现了 Vue.js 的响应式机制。

当数据发生变化时,Observer 监测到变化并通知相应的 Dep,然后 Dep 再通知相关的 Watcher 进行更新。

这整个过程使得 Vue.js 在数据变化时能够自动更新视图。

附录:「简历必备」前后端实战项目(推荐:⭐️⭐️⭐️⭐️⭐️)

Vue.js 和 Egg.js 开发企业级健康管理项目

带你从入门到实战全面掌握 uni-app

相关文章
|
22天前
|
存储 XML 移动开发
前端大厂面试真题
前端大厂面试真题
|
5天前
|
网络协议 算法 数据库
|
23天前
|
前端开发 Java 编译器
【前端学java】如何从前端视角快速学习Maven
【8月更文挑战第12天】如何从前端视角快速学习Maven
36 2
【前端学java】如何从前端视角快速学习Maven
|
24天前
|
前端开发 JavaScript API
前端框架Vue------>第二天学习(1)插槽
这篇文章介绍了Vue框架中插槽(slot)的概念和用法,以及如何在组件中使用自定义事件进行父子组件间的通信。
前端框架Vue------>第二天学习(1)插槽
|
10天前
|
前端开发 算法 网络协议
如何学习计算机基础知识,打好前端和网络安全的基础
如何学习计算机基础知识,打好前端和网络安全的基础
23 4
|
18天前
|
存储 前端开发 JavaScript
44 个 React 前端面试问题
【8月更文挑战第18天】
20 2
|
18天前
|
存储 JavaScript 前端开发
2022年前端js面试题
2022年前端js面试题
16 0
|
20天前
|
存储 前端开发 JavaScript
44 个 React 前端面试问题
44 个 React 前端面试问题
|
23天前
|
前端开发 JavaScript
前端网站学习大全
这篇文章提供了前端网站开发学习的资源大全,涵盖了HTML常用标签和CSS常用样式,以及如何使用`<meta>`标签提供页面元信息和`lang`属性定义内容语言等基础知识。
前端网站学习大全
|
24天前
|
前端开发 JavaScript
前端框架Vue------>第三天学习(1)
这篇文章介绍了Vue框架的组件基础和计算属性的概念,通过示例代码展示了如何定义可复用的Vue组件和使用计算属性来声明性地描述依赖其他值的数据。

热门文章

最新文章

下一篇
DDNS