- 博客(70)
- 收藏
- 关注
RSS订阅原创 token失效机制
token和刷新机制token机制就是在登录成功后返回一个token，并缓存起来，之后每个请求头里带上token，后端验证不通过返回401，前端就直接跳转到登录页。这样就能防止直接访问某个链接就能跳到登录页的尴尬局面。token刷新机制就是在使用的时候使用某个机制使得这个token不过期，不会跳转到登录页。而没有使用的时候token会过期，他隔得太久了再调接口就是401，就会跳到登录页。两种token刷新机制第一种（后端提供刷新接口）客户端 服务端 --- ...
2022-03-17 17:02:25
2459
1
原创 手牵手系列之git权限问题
关于注册gitLab报错上面的错误是因为注册时有一个google的验证码需要输入。但是中国无法访问google,因此无法访问并输入该验证码导致。解决方案：通过Github登陆。如若没有Github账号可以注册后登陆。...
2022-02-08 09:36:57
268
原创 手牵手系列之TypeScript函数与泛型
函数函数类型let add3:(x:number,y:number)=>numberadd3=(arg1:number,arg2:number):number=>arg1+arg2如果定义全局了一个新的变量，需要与函数之前两个变量相加，是不需要定义在函数类型里面let arg3 = 3add3=(arg1:number,arg2:number):number=>arg1+arg2+arg3接口定义函数类型interface Add3{ (x:n..
2022-01-25 23:52:05
483
原创 手牵手系列之TypeScript接口
const getFullName = ({ firstName, lastName }: { firstName: string, lastName: string }) => { return `${firstName} ${lastName}`}console.log( getFullName({ firstName: 'hhh', lastName: 'Li' }))
2022-01-24 17:23:16
377
原创 手牵手系列之TypeScript基础类型
布尔类型let bool:boolean = false// 或者let bool:booleanbool = true数值类型let num:number = 123// 二进制num = 0b1111011// 八进制num = 0o173// 十六进制num = 0x7b字符串类型let str:stringstr = 'abc'str = `数值是${num}`数组类型// 只能是number类型的数组// 写法一let arr:n..
2022-01-22 23:51:07
650
原创 手牵手系列之TypeScript开发环境搭建
新建项目初始化npm init安装全局依赖npm install typescript tslint -g执行命令初始化，项目根目录生成tsconfig.json文件tsc --init引入webpack(版本4.0)npm install webpack webpack-cli webpack-dev-server -D根目录新建build文件夹，以及文件下webpack.config.js文件，用于webpack相关配置。module.exports =...
2022-01-20 15:46:54
939
转载 每日三问之详解函数柯里化
什么是柯里化是把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数而且返回结果的新函数的技术。示例// 普通的add函数function add(x, y) { return x + y}// Currying后function curryingAdd(x) { return function (y) { return x + y }}add(1, 2) // 3cur..
2022-01-10 23:46:53
83
原创 初探webpack之搭建Vue开发环境
描述平时我们可以用vue-cli很方便地搭建Vue的开发环境，vue-cli确实是个好东西，让我们不需要关心webpack等一些繁杂的配置，然后直接开始写业务代码，但这会造成我们过度依赖vue-cli，忽视了webpack的重要性，当遇到一些特殊场景时候，例如Vue多入口的配置、优化项目的打包速度等等时可能会无从下手。实现搭建环境初探webpack，那么便从搭建简单的webpack环境开始，首先是初始化并安装依赖。$ yarn init -y$ yarn add -D webpa..
2022-01-06 00:01:12
768
原创 每日三问之前端面试题集锦
Javascript数据类型有哪些？字符串 string、数字 number、布尔 boolean、空 null、undefined、对象 object数组与字符串互转数组变字符串var a = [];var b = '';a=new Array{0,1,2,3,4,5};b=a.join(“-”); //b="0-1-2-3-4-5" 字符串变数组var b="0-1-2-3-4-5"；var a=b.split("-"); //在-分解 什么是原型..
2022-01-05 10:25:55
687
原创 每日三问之Vue常见性能优化
Vue常用性能优化Vue常用的一些优化方式，主要是在构建项目过程需要注意的方面。编码优化避免响应所有数据不要将所有的数据都放到data中，data中的数据都会增加getter和setter，并且会收集watcher，这样还占内存，不需要响应式的数据我们可以直接定义在实例上。<template> <view></view></template><script> export default { ..
2022-01-04 15:21:37
301
原创 每日三问之如何在vue项目中使用svg图片
下载依赖npm install svg-sprite-loader svgo-loader -Svue.config.js 中配置chainWebpack chainWebpack: config => { config.module.rule('svg').exclude.add(path.join(__dirname, 'src/assets/icons')).end() config.module .rule('icons') .te..
2021-12-30 13:35:45
627
原创 每日三问之react项目知识点--前期配置
react项目中使用绝对路径tsconfig.json{ "compilerOptions": { "baseUrl": "./src", },}
2021-12-28 16:06:16
285
原创 每日三问之HTTP协议知识点
什么是HTTP协议HTTP超文本传输协议就是指在浏览器发送和服务器接收请求以及返回响应的时候接受要遵守的一套规则，就像汽车在路上行驶也要根据交通规则来进行啊，不然就乱套了。http超文本传输协议是基于TCP/IP通信协议来传递数据的，在OSI七层中的应用层。HTTP协议的特点①通信速度比较快，因为HTTP协议简单，客户端每次向服务器发出请求的时候只需要传递请求方法和路径就可以了。②比较灵活，因为HTTP协议允许传输任意类型的数据对象。正在传输的类型由Content-Type标记。..
2021-12-26 22:27:53
1295
转载 每日三问之HTTP状态码
基本介绍状态码（Status Code）和原因短语（Reason Phrase）用于简单描述请求的结果。常见的比如:200 OK，表示请求成功； 404 Not Found表示请求的资源未找到。原因短语(上面的ok 和Not Found)是对状态码的解释说明。形如200这样的状态码，这里的3位数字中第1位数字，通常表示响应的类别（会有一两个例外），大致可以分成以下几类（完整的状态码表，参见http1.1-RFC6）：状态码 含义 1xx 请求正被处理 2xx ..
2021-12-25 22:47:59
811
原创 url 转 base64、base64 转 blob、blob 转 base64
url 转 base64原理： 利用canvas.toDataURL的API转化成base64function urlToBase64(url) { return new Promise ((resolve,reject) => { let image = new Image(); image.onload = function() { let canvas = document.createElement('canvas...
2021-12-16 15:48:59
511
原创 每日三问之javascript之表单的基础知识、文本框&&选择框脚本
表单的基础知识在HTML 中，表单是由<form>元素来表示的，而在 JavaScript 中，表单对应的则是 HTMLForm-Element 类型。HTMLFormElement 也有它自己下列独有的属性和方法。acceptCharset：服务器能够处理的字符集；等价于 HTML 中的 accept-charset 特性。 action：接受请求的 URL；等价于 HTML 中的 action 特性。 elements：表单中所有控件的集合（HTMLColle...
2021-12-13 23:30:25
491
原创 每日三问之javascript之事件流、事件处理程序、事件对象、事件类型
JavaScript与 HTML 之间的交互是通过事件实现的。事件，就是文档或浏览器窗口中发生的一些特定的交互瞬间。事件流事件流描述的是从页面中接收事件的顺序。IE 的事件流是事件冒泡流，而 Netscape Communicator 的事件流是事件捕获流。事件冒泡IE 的事件流叫做事件冒泡（event bubbling），即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。<!DOCTYPE htm...
2021-12-05 23:09:55
313
1
原创 每日三问之javascript之DOM 扩展
DOM 扩展选择符 APIquerySelectorquerySelector()方法接收一个 CSS 选择符，返回与该模式匹配的第一个元素，如果没有找到匹配的元素，返回 null。//取得 body 元素var body = document.querySelector("body"); //取得 ID 为"myDiv"的元素var myDiv = document.querySelector("#myDiv"); //取得类为"selected"的第一个元素v...
2021-12-05 14:10:15
520
原创 每日三问之javascript—DOM文档对象模型
DOM（文档对象模型）是针对 HTML 和 XML 文档的一个 API（应用程序编程接口）。DOM描绘了一个层次化的节点树，允许开发人员添加、移除和修改页面的某一部分。节点层次以下面的 HTML 为例：<html> <head> <title>Sample Page</title> </head> <body> <p>Hello World!</p> </bo..
2021-12-03 14:45:04
266
原创 每日三问之javascript—BOM浏览器对象模型
window 对象BOM 的核心对象是 window，它表示浏览器的一个实例。全局作用域所有在全局作用域中声明的变量、函数都会变成 window 对象的属性和方法。var age = 29; function sayAge(){ alert(this.age); } alert(window.age); //29 sayAge(); //29 window.sayAge(); //29由于 sayAge()存在于全局作用域中，因此 this.age 被映射到 w..
2021-12-02 21:49:58
375
原创 每日三问之javascript面向对象之继承
原型链构造函数、原型和实例的关系：每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。实现原型链有一种基本模式，其代码大致如下。function SuperType(){ this.property = true; }SuperType.prototype.getSuperValue = function(){ return this.property; }; function SubType(){ ..
2021-11-23 22:49:28
825
原创 每日三问之javascript面向对象之函数
所有原型对象都会自动获得一个 constructor （构造函数）属性，这个属性包含一个指向 prototype 属性所在函数的指针。就拿前面的例子来说， Person.prototype.constructor 指向 Person。而通过这个构造函数，我们还可继续为原型对象添加其他属性和方法。展示了 Person 构造函数、Person 的原型属性以及 Person 现有的两个实例之间的关系。在此，Person.prototype 指向了原型对象，而 Person.prototype...
2021-11-21 18:14:40
357
原创 每日三问之javascript面向对象之创建对象
javascript面向对象面向对象（Object-Oriented，OO）的语言有一个标志，那就是它们都有类的概念，而通过类可 以创建任意多个具有相同属性和方法的对象。理解对象创建自定义对象的最简单方式就是创建一个 Object 的实例，然后再为它添加属性和方法。var person = new Object(); person.name = "Nicholas"; person.age = 29; person.job = "Software Engineer"..
2021-11-18 17:09:59
368
原创 每日三问之JavaScript基本类型和引用类型的值、JavaScript执行环境及作用域、JavaScript垃圾收集机制
JavaScript基本类型和引用类型的值
2021-11-17 14:56:24
750
原创 每日三问之JavaScript数据类型、JavaScript操作符、关于vue路由守卫知识点
JavaScript数据类型ECMAScript 中有 5 种简单数据类型（也称为基本数据类型）：Undefined、Null、Boolean、Number 和 String。还有 1种复杂数据类型——Object，Object 本质上是由一组无序的名值对组成的。...
2021-11-08 22:50:04
362
原创 每日三问之$nextTick基本用法、详解css盒子模型、prototype与proto详解
$nextTick基本用法定义在下次DOM更新循环结束后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的DOM。即当数据更新了在DOM中渲染后自动执行该函数。methods: { // ... example: function () { // modify data this.message = 'changed' // DOM is not updated yet this.$nextTick(fu...
2021-10-27 20:01:45
177
原创 每日三问之$attrs && $listeners用法、$refs 基本用法、关于事件冒泡 &&事件捕获 &&DOM事件流
$attrs && $listeners
2021-10-26 11:15:52
425
原创 每日三问之watch&&methods&&computed区别、this指向解析、如何更改this指向
watch&&methods&&computed区别
2021-10-23 16:03:22
521
原创 每日三问之节流与防抖、filter过滤器、v-slot插槽
节流、防抖函数节流(throttle)：高频率触发的事件,在指定的单位时间内，只响应第一次(前面触发的执行前，忽略后面的事件)函数防抖（debounce）:在一段时间内，只响应最后一次，如果在指定时间触发，则重新计算时间（后面触发的事件执行，替代了前面的事件）函数节流（throttle）与函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。节流// 我们可以知道这里 fun.apply...
2021-10-22 14:59:49
188
原创 优秀代码记录学习
router跳转router.beforeEach((to, from, next) => { document.title = `${to.meta.title} | vue-manage-system`; const role = localStorage.getItem('ms_username'); if (!role && to.path !== '/login') { next('/login'); } else if.
2021-10-17 22:30:53
120
原创 前端开发规范
引自《阿里规约》的开头片段：----现代软件架构的复杂性需要协同开发完成，如何高效地协同呢？无规矩不成方圆，无规范难以协同，比如，制订交通法规表面上是要限制行车权，实际上是保障公众的人身安全，试想如果没有限速，没有红绿灯，谁还敢上路行驶。对软件来说，适当的规范和标准绝不是消灭代码内容的创造性、优雅性，而是限制过度个性化，以一种普遍认可的统一方式一起做事，提升协作效率，降低沟通成本。代码的字里行间流淌的是软件系统的血液，质量的提升是尽可能少踩坑，杜绝踩重复的坑，切实提升系统稳定性，码出质量。一、编程规
2021-09-22 19:50:08
200
原创 手牵手之前端知识积累大全
css盒子模型css盒子模型 又称框模型 (Box Model) ，包含了元素内容（content）、内边距（padding）、边框（border）、外边距（margin）几个要素css 外边距合并（叠加）两个上下方向相邻的元素框垂直相遇时，外边距会合并，合并后的外边距的高度等于两个发生合并的外边距中较高的那个边距值，如图：box-sizing属性介绍box-sizing : content-box|border-box|inherit;content-box...
2021-08-25 22:59:07
153
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人