- 博客(55)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 typescript(元组、枚举、类、泛型)
枚举用了C#的思想，常常用于取值被限定在一定范围内的场景，比如：颜色(红绿蓝)，方向(上下左右)，时间(年月日)，旋转角度(0,90,180)。能解决这个，但是我们就失去了传入的类型和传出的类型应该是一致的。修饰的属性或方法是公有的，可以在任何地方被访问到，默认所有的属性和方法都是。对元组增加新的元素时，它的类型会被限制为元组中每个类型的联合类型。因此，我们需要一种方法使返回值的类型与传入参数的类型是相同的。修饰的属性或方法是私有的，不能在声明它的类的外部访问。修饰的属性或方法是受保护的，它和。
2023-03-20 21:05:29
953
原创 typescript(接口、联合类型、类型别名、数组、函数、默认值)
es6允许了给参数入参增加默认值，ts对于给与默认值的参数识别为可选参数，此时就不受 可选参数必须接在必需参数后面。对于后端返回的唯一标识id，前端不能直接进行修改，我们在使用接口定义的时候，可以使用。在js为[],里面的值可以为任意类型，可以理解为 ts中的。对于右侧的函数进行校验，但是对于左边是通过右侧得出的类型，输入多余的参数是不被允许的，可以定义可选参数 使用。在ts中，对于函数入参和返回值都需要考虑。如果需要我们可以手动给num进行添加类型。前端项目中使用接口校验数据，示例。
2023-03-16 20:25:41
1791
原创 typescript(类型)
等同于声明了any类型，声明了any相当于一夜回到解放前，已经脱离了类型校验，再明确类型后，不建议使用any。类型的变量，但是void声明的变量不能赋值。任意值（Any）用来表示允许赋值为任意类型。是所有类型的子类型。类型，则允许被赋值为任意类型。类型的变量，可以赋值给。
2023-03-15 18:44:25
230
原创 npm install 模块后，模块不是内部命令或外部命令，也不是可运行的程序或处理的文件
npm install xxx 后 ，查找xxx -V 报错
2023-03-14 18:51:16
1164
原创 给你三个数组，请你输出三个数组里都有的数字
<script> const arr1 = [1, 2, 3, 4, 4, 10]; const arr2 = [1, 1, 1, 4, 5, 10]; const arr3 = [4, 10, 12]; function diffArray(arr1, arr2, arr3) { // 请实现代码 arr4 = []; .
2021-12-06 14:18:33
467
1
原创 Git合并问题
合并问题一如果出现以下界面 按下shift加分号 (shift + :) , 此时，会在底部出现一个输入框，写入wq，然后按下回车 或者 输入i 然后删除黄色字母 写一个自己合并分支后的名字 然后按esc(左上角键盘) 接着输入shift + : 输入q退出即可 wq的意思是保存并退出这个交互窗口。 此时，再次去通过git log查看提交日志，就会发现你刚才的merge操作已经成功 然后将合并的代码git push 到远程仓库即可合并问题二远程的代码和本地代码修改了同
2021-11-27 16:14:03
938
原创 Vue/cli 解决跨域配置说明
在vue.config.js配置文件中，有一项是devServer进行配置module.exports = { devServer: { // 代理配置 proxy: { // 这里的 api 表示如果我们的请求地址以 /dev_api 开头的时候，就出触发代理机制 '/dev_api': { target: 'www.baidu.com', // 需要代理的地址，就是后端服务器地址 changeOrigin: true, /
2021-11-26 13:33:55
3616
原创 vuex持久化 , vuex-persistedstate
vuex持久化 , vuex-persistedstate , 修改本地储存为Cookie
2021-11-22 19:17:51
3820
原创 element组件库tree组件的数据处理,数组转换为树
const data = [ { id: '01', name: '张大大', pid: '', job: '项目经理' }, { id: '02', name: '小亮', pid: '01', job: '产品leader' }, { id: '03', name: '小美', pid: '01', job: 'UIleader' }, { id: '04', name: '老马', pid: '01', job: '技术leader' }, { id: '05', name: '.
2021-10-31 20:13:06
645
原创 统计字符串中出现次数最多的字符
<body> <script> let str = 'aaaaabbccc'; let obj = {}; for (let i = 0; i < str.length; i++) { if (obj[str[i]]) { obj[str[i]]++; } else { ...
2021-10-30 21:20:18
149
原创 数组去重方法
<body> <script> let arr = [1, 1, 12, 2, 2, 2, 3, 4, 4]; // 数组去重1 // let newarr = []; // arr.forEach((item, index) => { // if (newarr.indexOf(item) === -1) { .
2021-10-30 21:11:15
111
原创 v-model双向绑定原理(数据劫持--＞视图更新--＞观察者)(未完)
v-model v-model双向数据绑定 通过变量可以修改v-model的值 , 而绑定了v-model的标签(input , textarea , components)进行赋值的时候 , 可以修改data变量的值 当一对多的时候 , 我们可以使用一个变量控制v-model 当一一对应的时候 , 通常使用一个对象里的属性来进行控制 而v-model的本质 : 绑定了input的value指向了data里的变量，并且在触发input事件的时候去动态把 data变量的值设...
2021-10-25 13:22:55
333
原创 项目打包,去除控制台打印
一行代码 重写console.log方法 // 重新console.log方法 , 放在main.js入口文件即可console.log = function () { } 优化写法 一行代码的写法 , 也可以控制台输出解决问题 , 但我们在开发环境下还需要对log进行删除,而生产环境还需要添加 , 虽然重复这样也可以解决问题 , 但为了优化 , 只需要判断生产环境重新方法 , 开发环境不重写即可 , 那么判断即可 在main.js入口文件复制这行代码即可 ...
2021-10-24 20:34:29
1060
原创 面试如何快速手搓JavaScript防抖和节流
为什么需要防抖和节流 在进行窗口的resize, scroll , 输入框内容校验等操作的时候,如果事件处理函数调用的频率无限制 , 会加重浏览器的负担 , 导致用户的体验非常糟糕 在进行网络请求的时候 , 点击事件 , 输入框值改变的时候 , 都需要发送网络请求 , 如果不进行处理的话 , 一直发送网络请求 , 会加重浏览器和服务器的负担 防抖 将几次的多次触发的操作合并为一次操作进行 防抖原理 原理是维护一个计时器 , 规定在delay事件后触发函数,但是在一定时...
2021-10-24 20:05:54
200
原创 如何优化你的vue项目
为何优化项目 我们的项目写好之后,为了优化用户的体验和减轻服务器的压力,我们回头一系列的优化,使自己的项目加载更快,所以要进行代码的优化 而优化的方式有很多,具体如下 路由懒加载 组件缓存 用户无感觉刷新token(登录后完成未完成的操作) 图片懒加载 减少代码的冗余(复用的代码封装函数) 为了后期的维护,可以封装以下工具文件 增删改查token 封装api接口(各种接口可以再分文件) 引入的第三方工具包(类似于day.js,moment...
2021-10-23 13:01:17
489
原创 JavaScript浅拷贝,深拷贝
拷贝 拷贝就是将一份数据(对象,数组)完整复制一份给另外一个变量 谈起拷贝你就需要对数据类型和堆,栈有所了解 因为简单数据类型在栈里存着,可以理解为数据就在栈里可以直接修改或者拿取 复杂类型数据(数组,对象)的数据在堆里存着,栈里存的为数据的地址 拷贝对于简单类型,可以拿到值. 而对于复杂数据类型来说,只能拿到内存地址 浅拷贝 浅拷贝只能拷贝第一层的数据 浅拷贝对于简单数据类型可以拷贝 对于复杂类型,拷贝的为内存地址,如果修改原数据的值,拷贝的值也会发生变化,而..
2021-10-16 21:13:58
206
原创 你真的知道vuex?
什么是vuexvuex是一个专为vue.js应用程序开发的状态管理模式 采用集中式存储管理数据,以相应的规则保证状态以一种可预测的方式发生变化 简单描述就是状态管理模式(白话: '全局'统一集中式管理全局变量) 为何学习vuex 程序页面较多时,数据变量也多 常用于组件通信(简单的父子通信和兄弟通信我们可以通过props或$emit传值) 而复杂的通信我们不可能一步一步将数据传过去,而这个时候就可以通过vuex进行统一数据管理 veux的不同组件数据保..
2021-10-13 20:44:40
343
原创 项目打包出现路径错误解决方案
打包步骤 脚手架工程运行 npm run build 或yarn build 作用: 用vue-cli内部集成的webpack,把.vue,.less.js 等打包成浏览器可可直接执行的代码. 结果:会在项目根目录下创建/dist目录,在这个目录下产出打包后的结果 打包之后运行 直接使用vscode+liveserver插件运行打包后的静态网页index.html 打开之后显示空白页,打开控制台,发现全是路径引入错误 因为要的都是服务器根目录下的js..
2021-10-11 10:25:44
1702
原创 路由懒加载
// 引入登录页面路由// @是webpack里的内置路径// @代表src文件夹的绝对路径,不用加src// 引入的路径遇到文件夹默认找index文件// import Login from '@/views/Login'// import Layout from '@/views/Layout'// import Home from '@/views/Home'// import Article from '@/views/Article'// import Pubish from...
2021-10-11 09:47:16
195
原创 JavaScript继承
目录继承为什么继承构造函数式继承类式继承(原型继承,原型链继承)组合继承寄生式继承寄生组合式继承ES6之后的类式继承 继承 指的是子类继承父类的属性和方法 父类 : 被继承的类,是一个大的范围 子类 : 要继承的类, 是一个小的范围 例如: 动物是一个大的范围面试一个父类,动物可以吃,可以跑 狗是动物的一种,是一个子类,狗也可以吃,也可以跑 这些行为式类似的,我们希望被复用 继承就是讨论 如何让子类(狗)具有父...
2021-10-08 15:35:13
463
原创 vue路由系统进阶使用指南
目录声明式导航-传参vue 重定向vue路由 404页面(兜底判断)vue路由 模式设置vue路由 编程式导航 跳转vue路由 编程式导航 传参路由嵌套vue路由 声明式导航 类名区别组件缓存组件缓存 设置条件组件缓存中的钩子函数总结 声明式导航-传参 在跳转路由时,可以给路由对应的组件传值 在router-link上的to属性传值,语法格式如下 /path?参数名=值 /path/值 – ...
2021-10-04 17:14:35
227
原创 vue路由系统基本使用指南
目录路由是什么路由的使用场景vue路由基本步骤分为七步案例结语 路由是什么 路由是一种映射关系 路径和组件的映射关系 接口和服务的映射关系 路由器和设备IP的映射关系 vue路由其实就是路径和组件的映射关系 路由的使用场景 我们为何学习和使用路由 单页面应用(SPA):所有的功能都在一个HTML页面上实现 前端路由的作用就是实现业务场景切换 优点 整体不刷新页面..
2021-10-02 22:34:12
478
原创 vue生命周期钩子函数
目录生命周期生命周期图解初始化阶段挂载阶段更新阶段销毁阶段完整代码(内含详细注释)总结 生命周期 一个组件从创建到销毁的整个过程就是生命周期 分为4个阶段,8个方法 生命周期图解 初始化阶段 含义 1.new Vue() – Vue实例化(组件也是一个小的Vue实例) 2.Init Events & Lifecycle – 初始化事件和...
2021-10-01 10:43:45
1259
原创 深入解析vue脚手架methods,computed,data
目录数据 Data Property方法 methods计算属性 computed 数据 Data Property 组件的data选项是一个函数. Vue在创建新组件实例的过程中调用此函数. 它应该是一个对象,然后Vue会通过响应系统将其包裹起来,并以$data的形式存储在组件实例中. 为方便起见, 该对象的任意顶级property也直接通过组件实例暴露出来. export default { // data 是一个函数 // data为了存储数据,并将数据放在实
2021-09-29 22:00:15
1226
1
原创 vue脚手架基础使用
脚手架准备 安装@vue/cli全局模块包 yarn global add @vue/cli 或者 npm install -g @vue/cli 检查是否安装成功 在cmd中输入vue -V 会显示版本好 如果未显示则安装失败,显示就是安装成功 脚手架创建项目 创建项目 # vue和create是命令, vuecli-demo是自己的文件夹名 vue create vuecli-demo 选择模板 ...
2021-09-24 16:49:42
140
1
原创 vue常用指令和优势-01
vue是什么? 一个JavaScript渐进式框架,有自己的规则和语法 渐进式就是按需逐渐集成功能的使用 vue的优势 vue作为一款轻量级框架 , 简单易学 , 双向绑定数据 , 组件化 , 数据和结构相分离 , 虚拟DOM , 运行速度块 , 并且作者为中国人尤雨溪, 对应的API文档对国内开发者优化, 作为前端开发人员的首选入门框架 优势 vue可以进行组件化开发 , 使代码编写量大大减少 , 读者更加易于理解 vue最突出的优势在于可以..
2021-09-24 15:49:01
256
原创 面试常问的webpack知识点
什么是webpack webpack是一个JavaScript静态模块打包工具 webpack里面一切文件皆是模块,通过loader转换文件,通过plugin注入钩子 最终输出有多个模块组合的文件,webpack专注构建模块化项目 webpack可以看做模块打包机:所做的事情 分析你的项目结构 找到JavaScript模块以及其他的一些浏览器不能直接运行的扩展语言(scss,TS) 将其打包为合适的格式以供浏览器使用 webpack的优点 专注于处理模..
2021-09-24 15:10:28
200
原创 webpack-03,开发服务器
下载包 yarn add webpack-dev-server@3.11.2 -D 配置自定义命令server scripts: { "build": "webpack", "serve": "webpack serve"} 运行命令-启动webpack开发服务器 yarn serve 或npm run serve webpack开发服务器配置 在webpack.config.js中添加服务器配置 module.expor...
2021-09-24 13:11:15
116
原创 webpack-01,概念,作用,配置,打包HTML
webpack基本概念和作用 基本概念 除了合并代码,还可以翻译和压缩代码 less/sass -> css ES6/7/8 --> ES5 html/css/js --> 压缩合并 现代JavaScript应用程序的静态模块打包器 静态: 文件资源(css,html,js) 模块: node环境,引入文件,遵守模块化语法 作用 静态模块打包器 能翻译和压缩代码 减少代码包体积,让浏览器更快速的打开网页 ..
2021-09-24 12:56:18
119
原创 webpack打包提取css到独立文件(图解)
案例目标 将打包后的js文件中的css样式,提取出来放到独立的文件当中 案例准备 目录准备 需要的安装包 npm ihtml-webpack-plugin -D npm imini-css-extract-plugin -D npm i css-loader -D npm istyle-loader -D 目录代码(内含注释) css...
2021-09-22 21:07:04
775
原创 HTML块级元素和行内元素和行内块元素的特点和相互转换
行内元素 a , span , b , img , input , select , lable , em , button , textarea , selecting 行内元素的特点 行内元素设置宽高无效 行内元素总是和相邻的行内元素在同一行 行内元素的宽高默认为内容的宽高 行内元素内部只能容纳行内元素(特殊的类似于行内块元素a标签除外) 水平方向的padding和margin属性可以设置，但是垂直方向上的设置后无效。 ...
2021-09-21 22:05:05
541
原创 cookie,session,JWT(token)
鉴权 鉴权: 判断某用户是否有权访问服务器上的资源 例如; 用户需要登录之后才可以访问一些特定的界面 某些页面需要token才可以访问 HTTP是无状态的 早期的web只需要提供信息给访问者就行了,不需要记录状态,浏览器和服务器不能凭借HTTP协议来辨别请求的上下文 服务器是不能识别浏览器发出的请求是否之前发过 鉴权思路 一种: 将身份信息保存在服务器. 例如: 取快递的时候,报出快递号就可以查看是否有这个快递 快递点就是服务器,自己是客..
2021-09-20 16:23:41
229
1
原创 HTTP请求有多少种方式?
HTTP请求 客户端向服务器发出请求,服务器对请求做出响应 HTTP请求信息三种组成 请求方法URL协议/版本 请求头(Request Header) 请求正文 HTTP请求方式 HTTPRequestMethod共计十七种 GET : 请求指定的页面信息,并返回实体主体 HEAD : 类似于GET请求,只不过返回的响应中没有具体的内容,用于获取报头) POST : 向指定资源提交数据进行处理请求(例如提交表单或者上传文件),数据被包含在...
2021-09-19 18:40:27
371
原创 关于css3的渐进增强和优雅降级,它们有什么区别?
来源 渐进增强和优雅降级是伴随着css3流出来的一个概念 由于低版本的浏览器不支持css3,但css3的效果又太优秀不忍放弃,所以在高级浏览中使用css3而低级浏览器只保证最基本的功能 关键的区别是他们所侧重的内容,以及这种不同造成的工作流程的差异. a { display: block; width: 200px; height: 100px; ..
2021-09-18 21:46:15
125
原创 前端面试必问的Http状态码以及代表的意义
常用的状态码(必会) 200(ok),请求已经成功（其后是对GET和POST请求的应答文档。） 303(see other),所请求的页面可在别的url下被找到.告知客户端使用另一个URl来获取资源 400(bad Request) 服务器未能理解请求。 语义有误:当前请求无法被服务器理解,除非进行修改,否则客户端不应该重复提交这个请求 请求参数有误 404(not found): 请求失败,请求所需要的资源未在服务器上发现 500(internal server e..
2021-09-17 16:16:31
1203
原创 JavaScript伪数组(类数组)转化为真实的数组,数组实例化
什么是伪数组 伪数组具有length属性 可以通过下标(索引)找到具体的值 不具有数组的方法 伪数组也可以通过遍历去查找每一项 典型的伪数组 <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"..
2021-09-17 15:19:27
226
原创 关于JavaScript的this指向问题
JavaScript中的this 在JavaScript中:this是函数调用(函数执行上下文).有四种函数调用类型 函数调用:alert('hello world') 方法调用:console.log('hello world') 构造函数调用:new Function() 间接调用: alert.call(undefined,'hello world') 每种调用类型都要看方式,如何定义上下文,因此this其行为与开发人员预期的不同 此外,严格模式下也会影..
2021-09-17 14:24:49
163
原创 如何看待nodejs路由中间件
中间件定义 中间件是一个特殊的url地址处理函数，它被当作app.use(中间件函数) 的参数或者是某个路由处理函数中使用。 中间件是 express 的最大特色，也是最重要的一个设计。Express是一个自身功能极简，完全是路由和中间件构成一个web开发框架：从本质上来说，一个Express应用就是在调用各种中间件。 一个 express 应用，就是由许许多多的中间件来完成的 中间件的基本使用 // 具名函数格式：const handler1 = (r...
2021-09-17 11:56:44
326
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人