前端部分知识点总结

简介: 前端部分知识点总结

小程序接口的通用协议是什么

小程序接口的通用协议是HTTPS

小程序体验版本打开后显示空白,只有点击"打开调试模式"再次打开才能显示正常,原因是体验版本的接口协议是HTTP,但小程序只认HTTPS,所以不会去调接口,所以只有打开调试模式才能调接口,这就相当于我们在微信开发者工具上勾选上了"不校验合法域名、web-

view(业务域名)、TLS版本及HTTPS证书"。

vue怎么跨域

Vue本身不提供跨域功能,但是可以通过以下几种方式实现跨域:

  1. 使用代理服务器:在开发环境中,可以使用代理服务器来绕过跨域限制。例如,使用Node.js搭建一个代理服务器,将请求转发到目标服务器,从而绕过跨域限制。
  2. 设置CORS:在后端服务器中设置CORS(跨域资源共享)头部信息,允许来自特定域名的跨域请求。这样,Vue应用程序就可以与后端服务器进行跨域通信。
  3. 使用JSONP:JSONP是一种跨域解决方案,它利用了浏览器对于<script>标签不受同源策略限制的特性。在Vue中,可以通过使用第三方库(如vue-jsonp)来实现JSONP。
  4. 使用第三方跨域库:有许多第三方库可以解决Vue跨域问题,例如vue-fetch-plugin、axios等。这些库提供了跨域请求的功能,并可以与Vue集成使用。

需要注意的是,在生产环境中,通常会使用CORS或代理服务器来解决跨域问题。JSONP由于安全性问题,一般不推荐在生产环境中使用。

vue引入组件三步

在Vue中引入组件需要以下三步:

  1. 定义组件:使用Vue.extend(options)创建组件,其中options和new Vue(options)时传入的option参数几乎一样,但也有些许差别,例如el不要写,data必须写成函数等。
  2. 注册组件:在Vue实例创建时传入components选项或在Vue实例化之前通过Vue.component进行全局注册。
  3. 使用组件:在模板中通过标签的形式使用组件。

webview页面的使用要求

使用WebView页面时,需要注意以下几点:

  • 确认是否需要用户授权:如果WebView要访问设备上的敏感信息或执行危险操作,应该给用户一个明确的授权提示,让用户知道WebView正在执行的操作。
  • 确认WebView的配置:使用WebView时,应该检查WebView的配置和安全性,例如开启JavaScript、设置缓存大小等。
  • 遵守安全标准:保证WebView的安全性,防止跨站点脚本攻击、SQL注入等攻击

new操作符具体干了什么

JavaScript中的new操作符用于创建一个对象实例

new操作符的具体操作步骤如下:

  1. 创建一个新的空对象。
  2. 将构造函数的原型赋值给新对象的原型,这样新对象就可以访问构造函数原型上定义的属性和方法。
  3. 将构造函数的作用域赋值给新对象,使构造函数内部的代码可以访问新对象的属性和方法。
  4. 执行构造函数中的代码,可以在构造函数中初始化新对象的属性、设置默认值等操作。
  5. 如果构造函数没有显式地返回其他对象,那么new操作符会隐式地返回新创建的对象实例。

定时器和Promise谁先执行

定时器和Promise谁先执行为什么

定时器和Promise是两种不同的异步处理方式,它们谁先执行取决于具体的实现和代码逻辑。

定时器通常使用setTimeout或setInterval函数来执行定时任务,这些函数会在指定的时间间隔后执行回调函数。因此,如果在一个定时器的回调函数中调用另一个定时器,那么后一个定时器会在前一个定时器执行完毕后开始计时,并在指定的时间间隔后执行回调函数。

Promise是一种异步编程的方式,它使用异步函数来处理异步操作。Promise对象代表一个异步操作的最终完成(或失败)及其结果值。Promise可以解决回调地狱(Callback Hell)的问题,使异步操作更加可读和易于管理。

在Promise中,通常使用then或catch方法来注册回调函数,这些回调函数会在Promise的状态改变时被调用。如果Promise的状态已经改变,那么后续的then或catch方法将不会被执行。因此,如果在一个Promise的回调函数中调用另一个Promise的then或catch方法,那么后一个Promise会在前一个Promise的状态改变后开始执行。

总的来说,定时器和Promise谁先执行取决于具体的实现和代码逻辑。如果在一个定时器的回调函数中调用一个Promise的then或catch方法,那么后一个Promise会在前一个定时器执行完毕后开始执行。如果在一个Promise的回调函数中调用一个定时器的setTimeout或setInterval函数,那么后一个定时器会在前一个Promise的状态改变后开始计时。

get和post的区别,何时使用post

GET和POST是HTTP协议中的两种不同的请求方法,它们的主要区别在于数据在请求中的位置和方式,以及它们的安全性和幂等性。

  1. 数据位置:GET请求将数据放在URL的查询字符串中,而POST请求将数据放在请求体中。这意味着GET请求的数据可以被浏览器历史、缓存等记录下来,而POST请求的数据不会。
  2. 数据方式:GET请求的数据以查询字符串的形式发送,而POST请求的数据以请求体的形式发送。这意味着GET请求的数据是明文传输的,容易被中间人攻击,而POST请求的数据是加密传输的,相对更安全。
  3. 安全性:由于GET请求将数据暴露在URL中,因此它不适合传输敏感信息,如密码、银行卡号等。相反,POST请求将数据隐藏在请求体中,相对更安全。
  4. 幂等性:GET请求是幂等的,意味着多次执行相同的GET请求,服务器的状态不会改变。而POST请求不是幂等的,每次执行相同的POST请求可能会在服务器上产生不同的结果。

使用POST请求的场景一般包括但不限于:

  1. 向服务器提交数据,如注册、登录、提交表单等。
  2. 发送包含敏感信息的请求,如密码、个人信息等。

总结起来,当需要向服务器提交数据或发送包含敏感信息的请求时,应使用POST请求。

闭包的概念,优缺点

闭包的概念:

闭包=能够读取其他函数内部变量的函数。在本质上,闭包是将函数内部和函数外部连接起来的桥梁。

闭包的优点:

  1. 可以跨作用域访问变量,让函数外部也可以访问到函数内的变量。
  2. 可以创建一个安全的环境,保证内部代码不受到外部的干涉,实现私有成员,对外只暴露几个接口。
  3. 让父函数中变量的值始终保存在内存中。

闭包的缺点:

  1. 内存消耗大,容易造成内存泄露。
  2. 不利于代码的优化。

vue2和vue3的状态管理

Vue 2和Vue 3都可以使用Vuex作为状态管理工具,但是它们也有一些不同之处。以下是它们的概述:

Vue 2的状态管理:

在Vue 2中,如果你想要进行状态管理,通常会选择使用Vuex。Vuex是一个专门为Vue应用程序设计的状态管理模式库。它提供了一个集中化的存储,用于管理所有组件的状态,并且在组件之间共享这些状态。

在Vue 2中,你需要安装并配置Vuex,然后创建一个包含state、getters、mutations和actions等属性的store对象。State用于存储应用程序的状态数据,Getters允许从store中派生出一些新的状态,Mutations用于修改state的值,而Actions用于异步操作或提交多个mutations。

Vue 3的状态管理:

在Vue 3中,引入了一个新的特性 - Composition API(组合式API)。Composition API通过提供更灵活和可复用的逻辑组合方式,使得状态管理变得更加简单。

虽然Vue 3本身并没有特定的官方状态管理库,但你可以使用Vue 3的Composition API来实现类似于Vuex的状态管理。你可以在组件中定义自己的响应式状态,并使用refreactive将其包装起来。然后,你可以使用computed来派生新的状态,使用watch来监听状态的变化,并使用provideinject来实现跨组件的状态共享。

总结而言,Vue 2中的状态管理通常使用Vuex作为官方推荐的解决方案,而Vue 3中的状态管理可以利用Composition API来实现更灵活的方式。

vue2和vue3的打包有什么不同

Vue 2和Vue 3在打包方面有一些不同之处。以下是它们的概述:

Vue 2的打包:

在Vue 2中,通常使用Webpack或者其他类似的构建工具进行打包。Vue CLI是一个流行的脚手架工具,它基于Webpack并提供了一套预设配置,使项目的搭建和打包更加简单。

在Vue 2中,默认情况下,会将应用程序打包为一个JavaScript文件(通常是main.js),其中包含所有依赖的Vue库和组件。这个文件可以在浏览器中直接引入,并通过Vue的全局对象来访问应用程序。

此外,Vue 2还支持代码分割和异步加载,你可以使用Vue的异步组件功能(dynamic import)来延迟加载某些组件,从而实现按需加载和减小初始包大小的效果。

Vue 3的打包:

在Vue 3中,打包方式与Vue 2基本相同,可以使用Webpack或其他构建工具进行打包。Vue CLI也可以用于Vue 3项目的创建和打包。

与Vue 2相比,Vue 3采用了新的静态编译器,可以生成更小、更高效的代码。Vue 3的模板编译器支持更多的优化选项,例如标记静态节点、提取静态内容等,以减少生成的代码量和提高运行时的性能。

此外,Vue 3还引入了新的模块化系统,并采用了Tree-shaking特性,可以更好地优化打包大小。通过使用ES模块的形式来导入和导出组件、指令等,使得只导入实际需要的代码,减少了不必要的代码体积。

总结而言,Vue 2和Vue 3在打包方面的基本流程是相似的,但是Vue 3通过静态编译器、模块化系统和Tree-shaking等特性,能够生成更小、更高效的代码,从而进一步提升应用程序的性能和加载速度。

相关文章
|
6月前
|
前端开发 网络协议 JavaScript
|
6月前
|
JSON 前端开发 网络协议
前端知识点-----跨域
前端知识点-----跨域
66 0
|
2月前
|
Web App开发 前端开发 Linux
「offer来了」浅谈前端面试中开发环境常考知识点
该文章归纳了前端开发环境中常见的面试知识点,特别是围绕Git的使用进行了详细介绍,包括Git的基本概念、常用命令以及在团队协作中的最佳实践,同时还涉及了Chrome调试工具和Linux命令行的基础操作。
「offer来了」浅谈前端面试中开发环境常考知识点
|
3月前
|
缓存 运维 前端开发
前端必备的运维知识点
【8月更文挑战第25天】前端必备的运维知识点
67 1
|
3月前
|
缓存 负载均衡 前端开发
前端必会的nginx知识点
【8月更文挑战第22天】前端必会的nginx知识点
68 0
|
6月前
|
JavaScript 前端开发 Java
前端知识点03(JS)
前端知识点概览:了解JS中的this指向,包括全局、函数、new、apply/call/bind及箭头函数的规则。理解script的async和defer属性对脚本加载和执行的影响。探讨setTimeout和setInterval的用法及其在性能上的考量。ES6与ES5的区别在于新语法特性,如let/const、箭头函数、模板字符串、模块化、类和继承等。此外,ES6还引入了Symbol、解构赋值、默认参数、Map/Set和Generator等功能。别忘了点赞和支持作者哦!
47 1
|
6月前
|
前端开发 NoSQL JavaScript
前端知识点小结--mongodb,保准看明白
前端知识点小结--mongodb,保准看明白
|
12月前
|
JavaScript 前端开发 数据库
前端常见知识点汇总(ES6,Vue,axios,Node.js,npm,webpack)-3
前端常见知识点汇总(ES6,Vue,axios,Node.js,npm,webpack)
100 0
|
6月前
|
缓存 JavaScript 前端开发
【前端】Vue2知识点大全!
【前端】Vue2知识点大全!
225 1
【前端】Vue2知识点大全!
|
6月前
|
前端开发 JavaScript API
【前端】Vue3知识点合集
【前端】Vue3知识点合集
107 0
【前端】Vue3知识点合集