Preparing02

最新推荐文章于 2024-09-04 20:55:34 发布
最新推荐文章于 2024-09-04 20:55:34 发布
阅读量115 收藏
点赞数 1
文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Kedaya_7017/article/details/120951927
版权

目录

1.js中new操作符

2.路由

3.token

 4.说一下对Cookie和Session的认知，Cookie有哪些限制？

5.304

6.浏览器输入网址到页面渲染全过程

7.CSS单位

8.get和post

9.Vue&Jquery

10.Link&@import

11.vue-router的模式

12.localStorage和sessionStorage

13.css选择器优先级

 

1.js中new操作符

new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。

例：var obj = new Base();

var obj  = {}; 
obj.__proto__ = Base.prototype; 
Base.call(obj);

第一行，创建一个空对象obj
第二行，将这个空对象的proto成员指向了Base函数对象prototype成员对象
第三行，将Base函数对象的this指针替换成obj。

2.路由

通过改变URL，在不重新请求页面的情况下，更新页面视图。

实现主要有2种方式：

  • 利用URL中的hash("#");
  • 利用History interface在HTML5中新增的方法;

一般的需求场景中，hash模式与history模式是差不多的，根据MDN的介绍，调用history.pushState()相比于直接修改hash主要有以下优势：

  • pushState设置的新url可以是与当前url同源的任意url,而hash只可修改#后面的部分，故只可设置与当前同文档的url
  • pushState设置的新url可以与当前url一模一样，这样也会把记录添加到栈中，而hash设置的新值必须与原来不一样才会触发记录添加到栈中
  • pushState通过stateObject可以添加任意类型的数据记录中，而hash只可添加短字符串
  • pushState可额外设置title属性供后续使用

3.token

 token是在服务器端产生的。如果前端使用用户名/密码向服务器请求认证，服务器认证成功，那么在服务器端会返回token给前端。前端可以在每次请求的时候带上token以证明自己的合法地位。

token就相当于客户端登录账号的唯一标识，在做一些数据请求的时候，后台会要求在请求头中携带token，如果没有token，或者token过期，那么这个时候就会对这个客户端进行返回响应的数据，然后在前端解析这些数据，判断是token过期还是没有携带，从而让用户进行相应的操作。

token是在向后台请求数据的时候必不可少的。如果没有token，那么后台要么不会返回响应的数据，要么就会返回一些无关紧要的数据。

 4.说一下对Cookie和Session的认知，Cookie有哪些限制？

1.    cookie数据存放在客户的浏览器上，session数据放在服务器上。

2.    cookie不是很安全，别人可以分析存放在本地的COOKIE并进行COOKIE欺骗
考虑到安全应当使用session。

3.    session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能
考虑到减轻服务器性能方面，应当使用cookie。

4.    单个cookie保存的数据不能超过4K，很多浏览器都限制一个站点最多保存20个cookie。

5.304

304：Not Modified    未修改。所请求的资源未修改，服务器返回此状态码时，不会返回任何资源。客户端通常会缓存访问过的资源，通过提供一个头信息指出客户端希望只返回在指定日期之后修改的资源

6.浏览器输入网址到页面渲染全过程

DNS解析

TCP连接

发送HTTP请求

服务器处理请求并返回HTTP报文

浏览器解析渲染页面

连接结束

7.CSS单位

​

  • px：像素单位
  • rem：相对于根元素html的font-size计算
  • em：相对于元素font-size计算
  •  vw：视窗宽度的百分比
  •  vh：视窗高度的百分比
  •  vmin：当前较小的vw和vh
  •  vmax：当前较大的vw和vh

8.get和post

  • GET在浏览器回退时是无害的，而POST会再次提交请求。

  • GET产生的URL地址可以被Bookmark，而POST不可以。

  • GET请求会被浏览器主动cache，而POST不会，除非手动设置。

  • GET请求只能进行url编码，而POST支持多种编码方式。

  • GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。

  • GET请求在URL中传送的参数是有长度限制的，而POST么有。

  • 对参数的数据类型，GET只接受ASCII字符，而POST没有限制。

  • GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。

  • GET参数通过URL传递，POST放在Request body中。

9.Vue&Jquery

1、工作原理

Vue做到了数据和视图完全分离开，它首先把值和js对象进行绑定，然后修改js对象的值，Vue框架就会自动把dom的值就行更新。对数据进行操作不再需要引用相应的dom对象，他们通过Vue对象实现数据和视图的相互绑定。

jQuery则是要先使用选择器（$）来选取dom对象，然后对dom对象进行操作（如赋值、取值、事件绑定等）。

2、侧重

vue侧重数据绑定，可以应用于复杂数据操作的后台页面。如：表单填写页面

jquery侧重样式操作，动画效果等；可以应用于一些html5的动画页面，一些需要js来操作页面样式的页面中。

10.Link&@import

  • link属于HTML，而@import属于css
  • 页面被加载时，link会被同时加载，而@import引用的css会等到页面加载结束后加载
  • link是HTML标签，所以没有兼容性，而@import只有IE5以上才能识别
  • link方式样式的权重高于@import

11.vue-router的模式

hash模式
监听hashchange事件实现前端路由，利用url中的hash来模拟一个hash，以保证url改变时，页面不会重新加载。

history模式
利用pushstate和replacestate来将url替换但不刷新，但是一旦刷新，就会可能404，因为没有当前的真正路径，要想解决这一问题需要后端配合，将不存在的路径重定向到入口文件

12.localStorage和sessionStorage

localStorage和sessionStorage一样都是用来存储客户端临时信息的对象。

sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问。并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅是会话级别的存储。只允许同一窗口访问。
而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。同源可以读取并修改localStorage数据。

13.css选择器优先级

1. !important

在属性后面写上这条样式，会覆盖掉页面上任何位置定义的元素的样式。

2. 行内样式，在style属性里面写的样式。

3. id选择器

4. class选择器

5. 标签选择器

6. 通配符选择器*

7. 浏览器的自定义属性和继承

 

Kedaya_7017
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CEHv9 Module 02 Footprinting and Reconnaissance (1).pdf
02-06
preparing to take the CEH exam, you’ll undoubtedly want to find as much information as you can about computers, networks, applications, and physical security. The more information you have at your ...
oop-labs:OOP Labs 2021年Spring
04-09
oop-labsOOP Labs 2021 SpringRepo 文件说明lab: ...各次实验考察知识点NumStatusLab01: Java 语法 & 面向对象初步preparing02.preparing03.preparing04.preparing05.preparing06.preparing07.preparing08.preparing
Docker push镜像失败解决方法
01-10
Docker push镜像失败的问题。 以下是输入push自己的tomcat后出现...cefee3f6c961: Preparing 82f021d9c2b9: Preparing 4f91f02b4e49: Preparing a4b3ce7e1d4a: Preparing c3b95f8496f1: Preparing bcfb53b3ff7c: Wait
hadoop权威指南.示例代码
01-22
文件内容:(不需要下载了) Example code for "Hadoop: The Definitive Guide, Third Edition" by Tom White. ... ... ...ch01 - Meet Hadoop ch02 - MapReduce ch03 - The Hadoop ...app3 - Preparing the NCDC Weather Data
Spring Boot集成Mybatis中如何显示日志的实现
08-18
2020-04-02 21:43:39.881 DEBUG 92784 --- [ main] com.secbro.mapper.OrderMapper.update : ==> Preparing: UPDATE tb_order SET order_no = ?,amount = ? WHERE id =? 2020-04-02 21:43:39.917 DEBUG 92784 --- ...
Vue的状态管理——Vuex3&4&Pinia
警警的博客
08-30 2506
Pinia是Vue.js 3.x的状态管理库，它可以看作是Vuex的升级版，旨在提供一种更简单、更直观的方式来管理Vue.js应用程序的状态。Vuex 4是Vue.js 3.x版本的状态管理库，它在Vuex 3的基础上进行了多项改进和优化，使其更加适用于大型应用和复杂场景。Vuex 3是Vue.js 2.x版本的状态管理库，它提供了一种集中式存储和管理组件状态的方式。：在 Vue 3 项目中，你通常会使用 Vuex 4 或 Pinia 而不是 Vuex 3。在 Vue 3 项目中，你可能会在。
JS都有哪些操作数组的方法
ggq53219的博客
09-04 351
JavaScript 中操作数组的方法非常丰富，这些方法大致可以分为几类：创建和初始化数组、添加元素、删除元素、遍历数组、搜索元素、数组排序、数组映射和过滤等。
从面向对象(OOP)到面向切面(AOP)：编程范式的演变
妍思码匠的博客
08-30 1375
本文深入探讨了面向切面编程（AOP）在前端开发中的应用，解释了AOP如何通过动态增强与代码复用、降低模块间耦合度，为前端项目带来更高效、更模块化的解决方案。通过具体案例分析，如日志记录切面和动态埋点的实现，展示了如何利用装饰器模式、高阶组件等技术在前端实现AOP。理解AOP的原理与实践，将有助于开发者构建更易于维护和扩展的前端应用。无论你是前端新手还是资深开发者，本文都将为你提供有价值的见解和实用技巧。
vue3使用-watch监听总结
weixin_44072254的博客
09-01 488
{deep: true, immediate: true, flush: 'post'}：deep是深度监听；flush:如果想在侦听器回调中能访问被 Vue 更新之后的所属组件的 DOM就用'post'，sync'创建一个同步触发的侦听器，它会在 Vue 进行任何更新之前触发；flush: 'post'， 如果想在侦听器回调中能访问被 Vue 更新之后的所属组件的 DOM就用'post'flush: sync'，创建一个同步触发的侦听器，它会在 Vue 进行任何更新之前触发。监听数组的方式-示例。
vue3+vant4父组件点击提交并校验子组件form表单
liuzaixi的博客
08-30 478
方法进行表单验证，如果验证通过则执行提交逻辑。获取子组件的引用，在父组件的点击事件中调用子组件的。这样父组件就可以通过。调用子组件的验证方法了。
Nginx部署前端Vue项目
不会代码的小林
09-03 643
Nginx是一款轻量级的高性能Web服务器，可以用于静态文件的托管和反向代理等场景。现在，您可以在浏览器中访问http://example.com（请替换为您自己的域名），应该可以看到Vue应用程序正在运行。请将example.com替换为您自己的域名，将/var/www/my-project/dist替换为Vue项目的dist目录的实际路径。现在，我们需要配置Nginx来托管Vue项目的静态文件。接下来，我们可以使用Vue CLI创建一个新的Vue项目。在部署之前，我们需要先构建Vue项目。
【HTTP、Web常用协议等等】前端八股文面试题
Una的博客
09-01 1198
Axios 是一个基于 Promise 的 HTTP 客户端，用于在浏览器和 Node.js 中发送 HTTP 请求。它可以方便地与现代 JavaScript 框架（如 Vue、React 和 Angular）集成，提供了简洁的 API 和强大的功能。
Nuxt3入门：样式的注入、定义和使用（第3节）
沐爸的博客
08-31 1185
在 Nuxt3 中，如何在本地或全局注入本地样式表？如何注入本地字体？如何分发NPM的样式表？单文件组件的动态样式、作用域样式、CSS模块、预处理器如何使用？
JS设计模式之“语言之魂” - 原型模式
前端梦工厂
09-02 1362
当我们学习JavaScript的时候，经常会听到原型（prototype)、原型链（）和原型模式（）这些概念，它们之间有什么关联呢？怎么样才能使用好原型模式呢？原型模式是JavaScript语言的核心机制之一，同时也是JavaScript中最基本的设计模式，因此被称为“语言之魂”，通过对象的原型实现对象的继承和属性共享，同时基于原型链的机制实现对象的创建和属性的继承，原型模式在JavaScript中具有广泛的应用场景，使用原型模式可以节省内存，增加灵活性和可扩展性等。
Chapter 07 watch侦听器
2302_80253507的博客
08-30 1491
在 Vue 中，`watch` 侦听器是一个非常实用的工具，用于处理自定义数据的变化。本文详细讲解了 `watch` 侦听器的基本用法、深度侦听和常见应用场景。
ECharts实现雷达图详解
威哥爱编程，CSDN 博客专家、全栈领域新星创作者、华为 HDE，愿交天下 IT 技术爱好者
09-02 1512
创建一个函数来获取新数据并更新雷达图。我们可以使用 AJAX 请求从服务器获取数据，或者使用任何其他方法来获取数据。// 假设这是获取数据的函数，可以是AJAX请求或其他方式// 这里使用setTimeout模拟数据更新name: '动态数据'// 更新雷达图数据series: [{name: '系列1',}]});// 递归调用以实现定期更新}, 2000);// 每2秒更新一次数据// 初始调用数据更新函数O了，完美展示一下效果。
页面中存在多个iframe，根据src查找iframe，js将里面的某个class隐藏
qq_37161741的博客
08-30 281
【代码】页面中存在多个iframe，根据src查找iframe，js将里面的某个class隐藏。
javascript通过while循环和switch语句制作一个简易ATM机
最新发布
2301_81968528的博客
09-04 437
输入3，提示查看余额，弹出对话框，提示账户余额。输入2，提示取钱，弹出对话框，输入取钱金额。输入1，提示存钱，弹出对话框输入存钱金额。上述代码就是一个简易ATM的代码。
Electron基础(二) 进程通信的ipcMain、contextBridge、ipcRenderer
在下魔王ii的博客
08-30 1137
Electron进程间的通信
iometer 一直 preparing
09-27
IOMeter 一直 preparing 的问题通常是由以下原因引起的： 1. 配置错误：IOMeter 的一些设置可能不正确，导致无法启动测试。检查测试参数、测试目标和测试设备的设置，确保它们与所需的性能测试相匹配。 2. 资源...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值