喜刷刷1999-优快云博客

原创 React注意点

一、todoList案例相关知识点 1.拆分组件、实现静态组件，注意：className、style的写法 2.动态初始化列表，如何确定将数据放在哪个组件的state中？ ——某个组件使用：放在其自身的state中 ——某些组件使用：放在他们共同的父组件state中（官方称此操作为：状态提升） 3.关于父子之间通信： 1.【父组件】给【子组件】传递数据：通过props传递 2.【子组件】给【父组件】传递数据：通过props传递，要求父提前给子传递一个函数 4.注意defa

2022-04-10 16:04:48 243 1

原创 webpack基础学习笔记

#目录[TOC]// 在项目任意模块文件中，都可以使用 process.env.VUE_APP_BASE_API 获取值module.exports = { devServer: { port: 8888, host: "localhost", https: false, open: true, proxy: { // '/dev-api': { // t

2022-04-05 14:29:35 541

原创 less、scss，sass的区别

less、scss/sass的区别一、less、scss/sassscss/sass是动态样式语言，比css多出很多功能（如变量、嵌套、运算,混入(Mixin)、继承、颜色处理，函数等），更方便阅读和维护。less也是动态样式语言，一样也比css多处很多功能（如变量，继承，运算，函数）， Less 既可以在客户端上运行，也可在服务端运行 ( Node.js)。scss和sass的关系Sass是缩排语法，对于习惯css的web开发者来说很不直观，还是有点学习成本，也不能将css代码加入到sass里

2022-04-04 09:12:25 345

原创网络与前端性能优化

1、HTTP 和 HTTPS 区别2、HTTP1，HTTP2，HTTP3HTTP1.x 连接无法复用、队头阻塞、协议开销大和安全因素等多个缺陷；HTTP/1.0传输数据时，每次都需要重新建立连接，增加延迟。HTTP/1.1虽然加入keep-alive可以复用一部分连接，但域名分片等情况下仍然需要建立多个connection，耗费资源，给服务器带来性能压力。高延迟–带来页面加载速度的降低。无状态特性–带来的巨大HTTP头部。明文传输–带来的不安全性HTTP2 通过多路复用、二进制流、H

2022-04-03 09:08:14 378

原创 TypeScript 和Vue 3笔记

一.TypeScript快速上手1、初识 TypeScript1）. 初识 TypeScriptTypeScript 的介绍TypeScript是一种由微软开发的开源、跨平台的编程语言。它是JavaScript的超集，最终会被编译为JavaScript代码。2012年10月，微软发布了首个公开版本的TypeScript，2013年6月19日，在经历了一个预览版之后微软正式发布了正式版TypeScriptTypeScript的作者是安德斯·海尔斯伯格，C#的首席架构师。它是开源和跨平台的编程语言

2022-04-02 16:42:57 396

原创 Hooks基础学习笔记

#目录[TOC]一、React Hook 介绍与环境搭建Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性在 React Conf 2018 上，Sophie Alpert 和 Dan Abramov 介绍了 Hook官方视频建议观看官方文档,B站UP主其实也是照着官方文档敲了一遍,所以可以跟我一样,先看文档再去看UP敲一遍,自己在敲一遍,就基本会了ps:讲真的里面小哥哥挺帅的,我一不懂英语的愣是看着他听

2022-04-01 09:46:11 131

原创 React扩展

1. setStatesetState更新状态的2种写法 (1). setState(stateChange, [callback])------对象式的setState 1.stateChange为状态改变对象(该对象可以体现出状态的更改) 2.callback是可选的回调函数, 它在状态更新完毕、界面也更新后(render调用后)才被调用 (2). setState(updater, [callback])------函数式的setSta

2022-03-31 10:10:36 83

原创 React深入学习与源码解析笔记

#目录 [TOC]一、React基础知识总结在深入学习前,还是先捋一捋对于React基础知识的理解与总结如果想看详细的React基础知识点笔记,可以看本人 React系统学习笔记1、JSX这东西不用解释我为啥放在第一位说了吧,基本上我们大部分React开发者都是用jsx进行代码编写的这里不着重讲解基础语法,只是给出自己的理解与总结,有需要了解基础语法的同学 -->点我跳转Ⅰ-我们认为的JSX是什么?我们认为的JSX是什么? ===> 类HTML的语法? Re

2022-03-30 10:12:02 1329 1

原创 React系统学习笔记

React系统学习笔记#目录[TOC]Ⅰ-React基础知识与概念React相对于vue来说学习成本更高，或者说需要的基础知识更多，需要有一些预备知识点支撑webpack相关知识axios相关知识js基础与es6相关知识一、React简介官网链接:中文官网介绍描述用于动态构建用户界面的JavaScript(只关注视图)由Facebook开源1、React的特点声明式编程组件化编程React Native编写原生应用React Nati

2022-03-29 10:44:54 380

原创 JQuery笔记

文章目录1、DOM 对象与 jQuery 对象相互转换2、选择器3、排他思想4、链式编程5、jQuery 样式操作1、css样式操作2、设置类样式3、 tab栏切换4、类操作与className区别6、 jQuery 效果1、显示与隐藏2、滑动3、淡入效果4、自定义动画Animate5、停止动画7、属性操作8、jQuery 内容文本值9、jQuery 元素操作1、遍历元素2、创建添加删除元素10、 jQuery 尺寸1、 jQuery元素大小2、 jQuery位置11、jQuery 事件注册1、事件处理on

2022-03-27 10:26:37 1479

原创 Ajax笔记

文章目录一、Ajax简介1、XML简介2、Ajax的特点Ⅰ-AJAX 的优点Ⅱ-Ajax的缺点3、HTTP简介Ⅰ-请求报文Ⅱ-响应报文Ⅲ-Chrome网络控制台查看通信报文Ⅳ-http协议概述Ⅴ-http协议请求的常用方法Ⅵ-http协议状态码Ⅶ-Postman 增删改查4、安装nodemon自动重启工具二、原生Ajax〇-Ajax的使用Ⅰ-Get方式Ⅱ-json数据请求Ⅲ-Post方式Ⅳ-解决ie缓存问题Ⅴ-请求超时与网络异常Ⅵ-取消请求Ⅶ-重复请求问题三、常见三种Ajax请求方式1、jQuery发送AJ

2022-03-26 11:27:19 1440

原创 03.25 随手记

1.watch 是一个对象时，它有哪些选项？handler 当监听对象时deep 是否深度immeditate 是否立即执行。2.如何在TypeScript中实现继承？继承可以通过使用extend关键字来实。3.TypeScript是否支持所有面向对象的原则？其面向对象编程的四个主要原则有哪些？支持。封装,继承,抽象,多态性。...

2022-03-25 10:21:13 84

原创 03.24 随手记

1.AJAX 的优点及缺点？AJAX 的优点可以无需刷新页面而与服务器端进行通信。允许你根据用户事件来更新部分页面内容。AJAX 的缺点没有浏览历史，不能回退存在跨域问题(同源)SEO 不友好2.异常捕获语句执行的过程为？一、最大区别在于offsetLeft可以返回没有定位盒子的距离左侧的位置。如果父系盒子中都没有定位，以body为准。二、offsetTop 返回的是数字，而 style.top 返回的是字符串，除了数字外还带有单位：px。三、offsetTop 只读，而 styl

2022-03-24 10:01:18 160

原创 03.23 随手记

1.生命周期分为几个阶段？初始化显示，更新显示，销毁vue实例阶段2.怎么进行精确匹配？在router link上添加添加Exact属性会进行精确匹配否则就会模糊匹配，例如在访问/new模糊匹配也会把/new的属性匹配到/身上3:Local storage 和Session storage的区别Local 生命周期（数据)是保存本地的只能手动清空Session 生命周期是随着浏览器的-当浏览器关闭就清空了...

2022-03-23 09:55:58 112

原创 03.22 随手记

1.float f=3.4;是否正确？请说明。不正确。3.4是双精度数，将双精度型( double ）赋值给浮点型（ float ）属于下转型( down - casting ，也称为窄化）会造成精度损失，因此需要强制类型转换 float f =( float ’ x 或者写成 float f =3.4F;。2.for···in和for···of的区别。①从遍历数组角度来说， for … in 遍历出来的是 key （即下标）, for …of 遍历出来的是value （即数组的值）;②从遍历字

2022-03-22 09:45:26 69

原创 03.21 随手记

1、vue跨域的解决方法？（1）后台更改header （2）使用jq提供jsonp （3）用 http - proxy - middleware （配置代理服务器的中间件）2、vue中组件怎么传值？正向：父传子父组件把要传递的数据绑定在属性上，发送，子组件通过 props 接收逆向：子传父子组件通过 this .$ emit （自定义事件名，要发送的数据），父组件设置一个监听事件来接收，然后拿到数据兄弟： eventbus 中央事件总线3、v-if与v-show的区别？v-show本质就是通

2022-03-21 09:55:40 149

原创 03.20 随手记

1、请对page- sizes，page- size，total，current- page进行属性说明。page- sizes：每页显示条数下拉框的选项设置；page- size：每页显示条目个数；total：总条目数；current- page：当前页数，支持.sync 修饰符2、组件可提高开发效率，增强可维护性，同时可以更好的去解决软件中的哪3大代码问题？高耦合、低内聚、无重用3、过滤器可以用在哪两个地方？双花括号** {{}} 和 v-bind **表达式...

2022-03-20 09:49:08 88

原创 03.19 随手记

1、项目前端技术架构我们会用到哪些？Vue.js Vue Router Vs Code Vuex Axios 等等2、在HTML 路由切换里标签和的区别？默认会被渲染成一个 <a> 标签，通过传入 to 属性指定跳转链接，不用加 # 号3、举例说几个编程式路由？router.push(…) router.replace(…) router.back(…) router.go(n)...

2022-03-19 11:00:08 141

原创 03.18 随手记

1.map，forEach和for区别？1）.map函数，遍历数组每个元素，并回调操作，需要返回值，返回值组成新的数组，原数组不变2）. forEach循环，循环数组中每一个元素并采取操作，没有返回值，可以不用知道数组长度3）.for循环，for循环是成熟且稳定的JS语法，可以在很多复杂的环境中运行，当大量数据及复杂逻辑的时候，for循环性能最佳，它能通过每个属性的 i 去针对性查找。2、vue 双向数据绑定（mvvm）原理？VUE实现双向数据绑定的原理就是利用了 Object.d

2022-03-18 10:22:53 88

原创 03.17 随手记

描述一下对"异步"和"同步的理解" ？异步：不按顺序执行，同一时刻只能执行一个事件同步：按顺序执行，同一时刻只能执行一个事件2.jQuery对象和Dom对象相互转换？jQuery对象转原生Dom对象 $(“div”).get(0)原生Dom对象转jQuery对象 $(ele)3.Let与var与const的区别？Let与var与const的区别Var声明的变量会挂载在window上，而let和const声明的变量不会Var声明的变量存在变量提升，let和const不存在变量提升同一作.

2022-03-17 10:22:14 155

原创 03.16 随手记

1.Vue 生命周期总共分为几个阶段？生命周期分为三大阶段：初始化显示、更新显示、销毁Vue实例初始化阶段的钩子函数：beforeCreate() 实例创建前：数据和模板均未获取到created() 实例创建后: 最早可访问到 data 数据，但模板未获取到beforeMount() 数据挂载前：模板已获取到，但是数据未挂载到模板上。mounted() 数据挂载后：数据已挂载到模板中更新阶段的钩子函数：beforeUpdate() 模板更新前：data 改变后，更新数据模板前调用upda

2022-03-16 08:10:55 82

原创 03.15 随手记

1 、箭头函数的this属性与普通函数的this属性有什么区别？（1）箭头函数里是没有this的，而普通函数是有this的（2）箭头函数中的this是在定义函数时绑定，普通函数是在执行函数时绑定。2、构造函数有什么作用？（1）给创建的对象建立一个标识符;（2）为对象数据成员开辟内存空间;（3）完成对象数据成员的初始化。3、说一说 JS 中的常用的继承方式有哪些？原型继承、组合继承、寄生组合继承、ES6的extend...

2022-03-15 10:24:21 102

原创 koa官方教程

简介Koa 是一个新的 web 框架，由 Express 幕后的原班人马打造，致力于成为 web 应用和 API 开发领域中的一个更小、更富有表现力、更健壮的基石。通过利用 async 函数，Koa 帮你丢弃回调函数，并有力地增强错误处理。 Koa 并没有捆绑任何中间件，而是提供了一套优雅的方法，帮助您快速而愉快地编写服务端应用程序。安装Koa 依赖 node v7.6.0 或 ES2015及更高版本和 async 方法支持.你可以使用自己喜欢的版本管理器快速安装支持的 node 版本：$

2022-03-14 09:27:45 248

原创 Cookie、session、图片验证码、jwt的使用

Cookie、session、图片验证码、jwt的使用一.response.cookie和request.cookie的区别范围特点使用语法各不相同response.cookie：操作过的Cookie，所有方法获取到的都是被更新过的值，也就是说Response.Cookies是修改所有容器中的Cookie的值。用于在客户端写入cookie值。若指定的cookie不存在，则创建它。若存在，则将自动进行更新。结果返回给客户端浏览器。Response.Cookies(CookieName

2022-03-13 09:34:50 400

原创 03.12 随手记

1.display:none和visibility:hidden区别？1）.display:none是彻底消失，不在文档流中占位，浏览器也不会解析该元素；visibility:hidden是视觉上消失了，可以理解为透明度为0的效果，在文档流中占位，浏览器会解析该元素；2）.使用visibility:hidden比display:none性能上要好，display:none切换显示时visibility，页面产生回流（当页面中的一部分元素需要改变规模尺寸、布局、显示隐藏等，页面重新构建，此时就是回流

2022-03-12 10:32:29 114

原创 03.11 随手记

1.什么是盒子模型？在网页中，一个元素占有空间的大小由几个部分构成，其中包括元素的内容（content），元素的内边距（padding），元素的边框（border），元素的外边距（margin）四个部分。这四个部分占有的空间中，有的部分可以显示相应的内容，而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。2.为什么typeof null是Object？因为在JavaScript中，不同的对象都是使用二进制存储的，如果二进制前三位都是0的话，系统会判断为是Object类型，而

2022-03-11 09:26:49 217

原创 03.10 随手记

1.JavaScript数组的常用方法有哪些？push、pop、shift、unshift、join、sort、concat、reverse、splice、slice、indexOf等2.什么是三元表达式？“三元”表示什么意思？三元表达式：? :。三元–三个操作对象。在表达式boolean-exp ? value0 : value1 中，如果“布尔表达式”的结果为true，就计算“value0”，而且这个计算结果也就是操作符最终产生的值。如果“布尔表达式”的结果为false，就计算“value1”，同

2022-03-10 09:27:35 140

原创 03.09 随手记（Mock数据生成器，Easy Mock基本使用）

1.什么是闭包，闭包要解决什么问题？闭包是一个对外不公开的空间，闭包内的数据不允许外界访问，要解决的问题就是间接访问闭包内的数据。2.如何把Dom对象转换成jQ对象，如何把jQ对象转换成Dom对象？（），（），（），[],3.Mock.js 数据生成器3.1 解决什么问题问题：前后端分离项目，前端和后端人员都是根据 API 文档进行开发项目的，不应该直接相互依赖，前端人员不应该等待后端开发好接口后再进行测试，既然不依赖后端接口，那前端人员应该如何测试呢？解决：可以通过模拟数据生成器，通

2022-03-09 12:02:31 1302

原创 DIff算法优化策略

优化策略vue2.x中的虚拟dom是进行全量的对比，在运行时会对所有节点生成一个虚拟节点树，当页面数据发生变更好，会遍历判断virtual dom所有节点（包括一些不会变化的节点）有没有发生变化；虽然说diff算法确实减少了多DOM节点的直接操作，但是这个减少是有成本的，如果是复杂的大型项目，必然存在很复杂的父子关系的VNode,而Vue2.x的diff算法，会不断地递归调用 patchVNode，不断堆叠而成的几毫秒，最终就会造成 VNode 更新缓慢。

2022-03-09 11:00:30 301

原创 03.08 随手记

1.在Javascript中什么是伪数组？如何将伪数组转化为标准数组？伪数组(类数组)：无法直接调用数组方法或期望length属性有什么特殊的行为，但仍可以对真正数组遍历方法来遍历它们。典型的是函数的argument参数，还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。2.jQuery中.get(

2022-03-08 09:34:01 169

空空如也

空空如也