- 博客(18)
- 收藏
- 关注
RSS订阅原创 React 中配置 eslint 搭配 Prettier Now 插件
步骤 1. 安装 eslint 创建配置文件 // 安装 eslint npm i eslint typescript -D // 项目根目录运行 npx eslint --init // 根据交互提示完成相关插件安装, 选择使用TypeScript 2. 设置vscode自动保存格式化 3. 补充配置文件:.vscode\settings.json { "eslint.run": "onType", "eslint.options": { "extensions"..
2021-12-23 18:26:21
415
原创 防抖和节流
防抖和节流是什么 防抖和节流都是性能优化的一种手段 防抖:一直触发事件不执行,不触发后一段时间再执行 节流:一直触发事件会执行,只是执行频率变低了 应用场景 防抖: 例如根据输入框内容请求数据 节流: 例如 滚动条滚动获取位置 封装 // 防抖 const debounce = (fn,time) => { let timer = null return function(...argus) { clearTimeout(timer) ...
2021-12-10 20:42:05
439
原创 前端常见面试题
柯理化 总结来说:通过函数调用返回函数的形式,实现多次接收参数最后统一处理的编码形式 就是柯理化 作用: 参数复用 封装一个柯理化函数 // 例如 function sum(a,b,c,d){ return a + b + c + d } sum(1,2,3,4) // 10 // 需求: sum(1)(2)(3)(4) 或 sum(1,2)(3,4) ... 也能得到10 function curry(fn){ // 用len 接收函数参数的长度 const len =.
2021-12-09 20:58:38
745
原创 移动端rem 和 vw 适配 vant
rem适配 // 安装 npm i amfe-flexible // main.js 中引入 import 'amfe-flexible' // 安装插件 npm i -D postcss-pxtorem // 配置 postcss.config.js module.exports = { plugins: { 'postcss-pxtorem': { rootValue({ file }) { // 判断读取css文件路径 return f
2021-12-07 16:39:21
313
原创 实例 原型 静态属性 原型链
实例 new 一个构造函数创建出来的就是实例 添加的实例属性和方法只能当前实例访问,不同实例的实例属性或方法不同 class 中直接赋值的属性或方法是实例属性或方法(相当于在constructor()里面定义的属性或方法) 原型 prototype, 直接添加到原型的属性和方法,不同实例都可以访问(首先查找实例上的属性和方法,没有再找原型) class 中用static 声明的属性或方法 是原型属性或方法 静态属性 通过构造函数直接添加的属性,只能通过构造函数本身访问(实例无法访问) 原型链
2021-12-06 21:50:25
286
原创 Promise 对象简单理解
Promise 对象代表了未来将要发生的事件,用来传递异步操作的消息 Promise 特点 三个状态 pending (初始状态) fulfilled (操作"成功") reject (操作"失败") 两个过程 padding ==> Resolved padding ==> Rejected 只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果 Promise 创建 const p = new Promise(function(resolve, reject).
2021-12-05 22:01:04
830
原创 前端常见面试题
1. http 状态码 访问一个网页时,浏览器会向网页所在服务器发出请求,当网页显示前,服务器会返回一个包含http状态码的信息头用来响应浏览器的请求 http 状态码由三个十进制数字组成,第一个数字定义了状态码的类型 (100~199) 信息响应 (200~299) 成功响应 (300~399) 重定向 (400~499) 客户端错误 (500~599) 服务器错误 常见状态码 200 ok: 请求被正常处理并返回 204 No Content: 表示请求得到成功处理,但没有...
2021-12-02 21:52:14
297
原创 前端常见面试题
1. em,rem,vw的区别 em 是相对父元素的font-size大小,具有继承的特点. 如果自身设置了font-size则按自身来计算 rem 是相对浏览器的根标签html的font-size大小 vw viewport width 的缩写, 表示可视窗口宽度 1vw是可视窗口宽度的1% 2. rem的适配原理 将每一个不同的屏幕划分成相同的份数,让同一个元素在不同的屏幕上占据相同比例的空间. 1rem 等于此页面的html的font-size. 我们要做的就是把不同的屏幕划分成相同的份数,在
2021-12-01 21:55:55
261
原创 js 数组方法
常用的数组方法 1. push() 和 pop() push() 方法可以向数组末尾添加一个或多个元素 pop() 方法可以删除数组最后一个元素,并返回被删除的元素 2. unshift() 和 shift() unshift() 方法可以向数组的开头添加一个或多个元素 shift() 方法可以删除数组开头的一个元素,并返回被删除的元素 3. join() join() 方法可以将数组转换成字符串,默认使用逗号分隔 let arr = [1,2,3]; console.log(arr.
2021-10-26 21:52:37
410
原创 Es6 和 同步异步任务
1. Es6 模块化 1.1 ES6 模块化规范中定义： 每个 js 文件都是一个独立的模块 导入其它模块成员使用 import 关键字 向外共享模块成员使用 export 关键字 1.2 在 node.js 中体验 ES6 模块化 node.js 中默认仅支持 CommonJS 模块化规范，若想基于 node.js 体验与学习 ES6 的模块化语法,可以进行如下配置: 确保安装了 v14.15.1 或更高版本的 node.js node -v 命令可查看
2021-10-17 20:48:41
755
3
原创 前端常见面试题01
今天学习nodejs写了一下之前项目的接口,感觉不知道分享什么就准备了一些常见的前端面试题,希望能对 大家有所帮助,面试题也会不定期更新的. 1. JavaScript 的原始类型有哪些 Boolean (布尔值) null (空) undefined (未定义的) number (数字类型) string (字符串) symbol (独一无二的值) symbol 是Es6引入的一种新的原始数据类型,大家估计比较陌生,可以去查一查文档 2. typeof 和 instanceof 的区别
2021-10-14 21:56:52
232
原创 JWT 认证机制
1. Web 开发模式 目前主流的 Web 开发模式有两种 基于服务端渲染的传统 Web 开发模式 基于前后端分离的新型 Web 开发模式 1.1 服务端渲染的 Web 开发模式 服务器发送给客户端的 HTML 页面, 是在服务器通过字符串拼接动态生成的.因此,客户端不需要使用 Ajax 这样的奇数额外请求页面的数据. 优点: 前端耗时少. 因为是服务器负责动态生成 HTML 内容,浏览器只需要直接渲染页面即可 有利于SEO. 缺点: 占用服务器资源.由于服务器动态拼接页面内容,若请求...
2021-10-13 22:00:12
374
原创 MYSQL的基本使用
1. 数据库的基本概念 1.1 什么是数据库 数据库(database)是用来组织,存储,和管理数据的仓库. 当今世界充斥着大量的数据.为了方便管理互联网中的数据,就有了数据库管理系统的概念. 用户可以对数据库中的数据进行新增,查询,更新,删除等操作. 1.2 常见的数据库 MySQL 数据库 (目前使用最广泛,流行度最高的开源免费数据库) Oracle 数据库 (收费) SQL Server 数据库 (收费) Mongodb 数据库 其中, MySQL , Oracle , SQL Se.
2021-10-11 21:24:18
201
原创 CORS 与 JSONP 接口
今天我们就从 Express 接口开始详细了解一下CORS和JSONP接口. 1. Express 接口 创建基本服务器 创建API路由模块 编写 GET / POST 接口 // app.js 文件 const express = require('express'); // 导入 express 模块 const app = express(); // 创建实例 const router = require('./router'); // 导入路由模块 app.use('/api', ro
2021-10-11 10:27:29
317
2
原创 十分钟教你使用 Express 框架
express 框架作为npm官网上热度排名前十的存在,是我们作为前端程序员不可忽视的一部分,今天就让我们一起来了解并学会使用这个框架吧! 1.初识 Express 1.1 Express 简介 官方给出的概念：Express 是基于 Node.js 平台，快速、开放、极简的 Web 开发框架. 本质就是一个第三方包,其作用和node.js中内置http模块相似,是专门用来创建Web服务器的. 使用 Express，我们可以方便、快速的创建 Web 网站的服务器或 API 接口的服务器....
2021-10-09 21:57:35
768
原创 手把手教你发个包(详细步骤)
在上篇文章中我们已经初步了解了包的一些基本概念与规则,现在我们可以一起在npm官网上发布一个属于自己的包了. 1.需要的功能 发布自己的包之前,我们首先要想一想这个包需要实现什么功能(什么都可以),例如:实现时间格式化 const tools = require('hsxtapr'); // 2021-10-08 10:52:43 2.初始化包的基本结构 新建一个xxx文件夹,作为包的根目录. // 名字可以去官网查一个不重复的 在该文件夹中创建如下三个文件: package.j...
2021-10-08 14:01:33
640
原创 npm与包
学习到node阶段,学会开发一个属于自己的包是很重要的,可以更好的了解如何使用包,而想要开发包,首先就得了解什么是包,下面我们就让我们一起了解包的概念,并开发一个自己的包. 什么是包,为什么需要包? node.js中的第三方模块又叫做包. 由于node.js指提供了一些底层的API,基于内置模块进行开发时,效率很低.而包是基于内置模块封装出来的,提供了更高级,方便的API,极大的提高了开发效率.包有助于我们更轻松的开发. 详细可以了解npm官网. 了解之后可以使用npm包管理工具在https:..
2021-10-07 21:54:44
247
原创 nodejs中的模块化
node.js是一个基于Chrome v8解析引擎的 js 运行环境.简单来说就是运行在服务端的JavaScript.作为一门编程语言,模块化是非常基础的一个要求,可js在2015年前并没有这个概念,多个js文件放在同一个html文件中很容易出现变量污染的问题,好在es6的出现在语法层面支持了模块化,时代在发展,作为前端程序员,学习模块化是非常有必要的! 什么是模块化? 在编程领域中,模块化就是遵守固定的规则,把一个大文件拆分成独立并且相互依赖的多个小模块.通俗来讲就是一个js文件可以使用另一...
2021-10-06 20:56:17
678
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人