前端面试基础题库——4

目录

三十一、JavaScript  中的 AJAX  原理及应用。

三十二、浏览器同源策略 (Same  Origin  Policy) 及其限制。 

三十三、JavaScript 中的模块化开发及其作用。

三十四、CSS  中的媒体查询及其作用。

三十五、JavaScript  中的递归及其应用。

三十七、React 中 的 Router  (路由器)及其作用。

 三十八、JavaScript  中的事件循环 (Event   Loop) 机制。

三十九、Vue 中的计算属性 (Computed)    和侦听器 (Watch)   的区别及其使用场景。

四十、JavaScript  中的 Promise  (承诺)及其作用。

---

三十一、JavaScript  中的 AJAX  原理及应用。

         JavaScript 中的 AJAX(Asynchronous  JavaScript  and  XML) 是一种用于创建异步请求和处理服务响应的技术，将数据发送到服务器和从服务器接收数据都是异步进行的，不会干扰页面的正常操作。AJAX 的原理基于 XMLHttpRequest   对象，可以使用原生 JavaScript 或者 jQuery 等库进行开发，在前端 Web  开发中应用广泛，可以用于实现动态网页、数据交互等功能。

三十二、浏览器同源策略 (Same  Origin  Policy) 及其限制。 

        浏览器同源策略是一种浏览器安全策略，用于保护用户信息不被恶意网站获取，限制了来自不同源(协议、域名、端口)的脚本、文档和请求等交互操作。同源策略的限制包括不能读取非同源网站的Cookie、 不能向非同源网站发送 AJAX 请求、不能访问非同源网站的 DOM  树等。

三十三、JavaScript 中的模块化开发及其作用。

        JavaScript 中的模块化开发是一种将代码分离成更小、更容易管理的块的一种方法，可以将代码分成独立的模块，同时可以避免全局变量污染和命名冲突等问题。 JavaScript 中的模块化开发有多种实现方式，包括 AMD、CommonJS和 ES6 模块等。

三十四、CSS  中的媒体查询及其作用。

        CSS 中的媒体查询是一种用于在不同的媒体设备或屏幕大小下应用不同样式的一种方式。媒体查询通过 使用@ media 规则，可以指定一个或多个条件，当满足时则应用后面的样式内容。媒体查询的作用包括适配不同设备，提高页面响应能力，优化用户体验等。

三十五、JavaScript  中的递归及其应用。

        JavaScript 中的递归是一种在函数之内调用自身的行为，可以用于处理具有递归结构的数据或操作。递 归的应用包括处理复杂的数学计算、解决复杂的问题(如数据搜索、遍历、排序等)和处理复杂的数据结构等。递归需要注意的问题包括栈溢出、递归停止条件、递归深度等。

三十六、HTTPS  的工作原理。 

         HTTPS  是一种基于加密通信的安全协议，用于保护网络通信安全。

         HTTPS的工作原理可以分为以下个步骤：

                首先，客户端向服务器发起 SSL 连接请求；

                然后，服务器将 SSL证书发送给客户端，客户端验证证书的合法性；

                接着，客户端随机生成一个对称加密算法的密钥，并使用公钥加密后发送给服务器；服务器使用私钥解密后获取密钥，并使用密钥加密数据发送给客户端；

                最后，客户端使用密钥解密数据，并进行数据校验。

三十七、React 中 的 Router  (路由器)及其作用。

        React 中的 Router 是一种用于处理路由的库，可以根据 URL 显示不同的组件和内容，提供 SPA(Single Page Application)的体验。 

        React 中的 Router 包括 BrowserRouter、HashRouter、MemoryRouter  等组件，可以实现不同的路由方式和操作。

 三十八、JavaScript  中的事件循环 (Event   Loop) 机制。

         JavaScript 中的事件循环机制是一种异步编程模型，用于处理事件、回调函数等异步执行的任务。事件 循环机制基于事件循环队列实现，包括宏任务和微任务两种类型，通过不断地取出队列中的任务依次执行来实现异步处理任务。

三十九、Vue 中的计算属性 (Computed)    和侦听器 (Watch)   的区别及其使用场景。

         Vue 中的计算属性和侦听器都可以用于监控数据变化，但二者的区别在于，计算属性返回计算后的值， 侦听器执行一段逻辑操作。计算属性适用于处理某些数据需要计算才能得到的场景，如价格折扣、数据筛选等；侦听器适用于处理数据更改后需要执行一些额外逻辑的场景，如数据请求、复杂操作等。

四十、JavaScript  中的 Promise  (承诺)及其作用。

         CSS  Flexbox 布局(又称 Flex 布局)是一种用于实现灵活和响应式布局的 CSS3  特性，可以实现各复杂的布局，并且适用于所有的终端设备和屏幕尺寸。 

        Flexbox 可以通过定义容器和子元素的属性来实现元素之间的布局关系。 Flexbox 引入了以下几个概念：

        ● Flex 容器：包裹 Flex  元素的父元素，用于定义 Flex  元素的布局。

        ● Flex 元素： Flex  容器的子元素，用于定义 Flex  元素的大小、位置等属性。

        ● 主 轴 (Main  Axis): 定义 Flex  容器的主要方向。

        ● 交 叉 轴 (Cross  Axis):  与主轴垂直的轴，用于实现元素在主轴上的对齐。

        使用 Flex 布局可以通过设置 display: flex 来定义 Flex 容器，从而实现元素之间的灵活布局和响应式设计。