随笔分类 -  web前端

摘要:先来看一个项目中的需求 作为苦逼的前端开发者,我们无时无刻都要面对产品经理提的各种需求, 比如下图这个场景 场景: 从首页的点击导航进入列表页, 列表页点击列表进入 该 数据详情页 从详情页返回,希望列表页缓存,不重新渲染数据,这样会提高用户体验。 分析一下 这样需求,如果是小程序的话,默认列表页就 阅读全文
posted @ 2023-08-24 16:02 可爱的小锋 阅读(557) 评论(0) 推荐(0)
摘要:跨域的产生是浏览器的安全机制引起的,只有在使用Ajax时才会发生。简单来说就是你可以通过ajax发送请求,但要看远程服务器脸色,他没授权,浏览器这个老六就给拦截了,不能用这个结果,像极了游戏机让买不让玩。 什么是跨域 跨域(Cross-Origin)指的是在 Web 开发中,一个网页的运行环境(域) 阅读全文
posted @ 2023-08-08 09:46 可爱的小锋 阅读(421) 评论(0) 推荐(0)
摘要:前端路由●路由: 就是一一对应关系的集合●前端路由: 就是一个 url 地址, 对应哪个组件(页面)●前端路由的本质○根据地址栏变化(不重新想服务器发送请求), 去局部更新不同的页面内容, 完成前端业务场景切换●前端路由的思路○URL 地址栏中的 Hash 值发生了变化○前端 JS 监听到 Hash 阅读全文
posted @ 2023-08-01 13:10 可爱的小锋 阅读(151) 评论(0) 推荐(1)
摘要:深浅拷贝 ●深浅拷贝指的是一种复制对象或者数组的行为●也就是把一个对象或者数组中的数据完完整整的复制一份放到另一个数组或者对象中●并且相互之间没有联系●说道深浅拷贝这个我们不考虑基本数据类型●因为基本数据类型没有引用地址一说●说到复制这个事儿 有三个级别○赋值○浅拷贝○深拷贝 赋值●就是把一个变量存 阅读全文
posted @ 2023-07-27 11:34 可爱的小锋 阅读(25) 评论(0) 推荐(0)
摘要:在表单控件中,我们知道input是有自带样式的,如图所示input是自带一定的样式,我们在修改CSS的时候得需要先了解一下它都自带哪些样式,这样修改调整的时候比较好设置,通过浏览器的控制台我们可以看到input自带的2px的边框,左右内间距是2,上下内间距是1. 想要清除input自带的样式,可以利 阅读全文
posted @ 2023-07-21 10:48 可爱的小锋 阅读(847) 评论(0) 推荐(0)
摘要:● 之前我们说的都是代码内 this 的默认指向 ● 今天我们要来说一下如何能改变 this 指向 ○ 也就是说, 你指向哪我不管, 我让你指向哪, 你就得指向哪 开局 ● 在函数的原型( Function.prototype ) 上有三个方法 ○ call ○ apply ○ bind ● 既然是 阅读全文
posted @ 2023-07-21 10:46 可爱的小锋 阅读(67) 评论(0) 推荐(0)
摘要:我们都知道div是一个块元素,块元素的特点是,独占一行,从上往下排列,但是有时候我们在页面排版的时候需要从左往右横着排列,想要实现这样的效果方法有很多,首先先来看一下,默认情况下的2个div的效果如下 代码如下: <!DOCTYPE html> <html lang="en"> <head> <me 阅读全文
posted @ 2023-07-14 10:53 可爱的小锋 阅读(704) 评论(0) 推荐(0)
摘要:margin的上下间距重叠问题 现象:2个上下并列结构的时候,如果给上面的盒子添加了margin-bottom,同时给下面的盒子添加了margin-top,此时应该解析的垂直间距是2者之和,但是浏览器解析的时候,会按照最大数值去解析。 <!DOCTYPE html> <html lang="en"> 阅读全文
posted @ 2023-07-14 10:46 可爱的小锋 阅读(23) 评论(0) 推荐(0)
摘要:1.JS的原型与原型链 每一个对象实例都有自己对应的构造器, 对应的构造器都拥有一个prototype的属性, 值为一个plain object,这就是 构造器的原型,而且对象实例的proto属性也指向构造器的原型: a.__proto__ A.prototype 所以构造器原型上的属性方法是可以被 阅读全文
posted @ 2023-07-12 14:10 可爱的小锋 阅读(93) 评论(0) 推荐(0)
摘要:什么是服务端渲染 好不容易搞利索了一个叫做 ajax 的东西, 终于知道了什么叫做请求, 什么叫做接口, get 和 post 有啥区别, 咋又来了一个服务端渲染和前后端分离呢 ? 接下来, 带你分清 服务端渲染 和 前后端分离! 渲染 ● 什么是渲染呢 ? ○ 其实很简单, 就是把数据反应在页面上 阅读全文
posted @ 2023-07-05 17:27 可爱的小锋 阅读(116) 评论(0) 推荐(0)
摘要:数组是一个复杂数据类型,我们在操作它的时候就不能再想基本数据类型一样操作了。 比如我们想改变一个数组 // 创建一个数组 var arr = [1, 2, 3] // 我们想把数组变成只有 1 和 2 arr = [1, 2] 这样肯定是不合理,因为这样不是在改变之前的数组。相当于重新制作了一个数组 阅读全文
posted @ 2023-06-30 13:21 可爱的小锋 阅读(37) 评论(0) 推荐(0)
摘要:本文为千锋资深前端教学老师带来的【JavaScript全解析】系列,文章内含丰富的代码案例及配图,从0到1讲解JavaScript相关知识点,致力于教会每一个人学会JS!文末有本文重点总结,可以收藏慢慢看\~ 更多技术类内容,主页关注一波! 阅读全文
posted @ 2023-05-29 17:36 可爱的小锋 阅读(230) 评论(0) 推荐(0)
摘要:React中的状态管理是开发人员需要解决的问题。 总有一些新库给你选择,而选择合适的库可能是一项困难的工作 状态管理一直是React中开发人员需要解决的问题,如何有条理的组织数据,如何快速的在项目中集成,这些都是我们做项目时选择技术的标准。 Redux一直是我们react项目中不二的状态管理插件,但 阅读全文
posted @ 2023-04-28 09:46 可爱的小锋 阅读(603) 评论(0) 推荐(0)
摘要:CSS基础 CSS(cascading style sheet) 汉译为层叠样式表,是用于控制网页样式WEB标准中的表现标准语言,在网页中主要对网页信息的显示进行控制。目前推荐遵循的是W3C发布的CSS3.0版本;用来表现HTML或者XHTML等样式文件的计算机语言。1998年5月21日由w3C正式 阅读全文
posted @ 2023-04-27 14:13 可爱的小锋 阅读(358) 评论(0) 推荐(0)
摘要:关注我了解更多web技术知识,带你一路“狂飙”到底!上岸大厂不是梦! 表单 1 : 表单标签 <form></form>属性 :action = '接口地址'method = 'get / post'name = '表单名称' 2 : 表单控件 <input>属性:type = '控件类型'name 阅读全文
posted @ 2023-04-25 11:44 可爱的小锋 阅读(67) 评论(0) 推荐(0)
摘要:关注我了解更多web前端技术知识,带你一路“狂飙”到底!上岸大厂不是梦! web前端开发框架是在前端工程师中经常会用到的内容,可以大大减少项目中的bug,节约开发成本,加快项目周期。在使用web前端开发框架之前,需要先了解web前端三三大主流框架有哪些。目前web前端三大框架Angular、Reac 阅读全文
posted @ 2023-04-23 16:24 可爱的小锋 阅读(826) 评论(0) 推荐(0)
摘要:●我们代码里面所说的函数和我们上学的时候学习的什么三角函数、二次函数之类的不是一个东西 函数的概念 ●对于 js 来说,函数就是把任意一段代码放在一个 盒子 里面●在我想要让这段代码执行的时候,直接执行这个 盒子 里面的代码就行●先看一段代码 // 这个是我们以前写的一段代码 for (var i 阅读全文
posted @ 2023-04-20 13:37 可爱的小锋 阅读(66) 评论(0) 推荐(0)
摘要:HTML 5 的第一份正式草案已于2008年1月22日公布。HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。 2012年12月17日,万维网联盟(W3C)正式宣布凝结了大量网络工作者心血的HTML5规范已经正式定稿。根据W3C的发言稿称:“HTML5是开放的Web 阅读全文
posted @ 2023-04-19 16:27 可爱的小锋 阅读(31) 评论(0) 推荐(0)
摘要:在 javascript 语言中, 有一个奇奇怪怪的 "关键字" 叫做 this ● 为什么说它是 奇奇怪怪 呢, 是因为你写出 100 个 this, 可能有 100 个解释, 完全不挨边 ● 但是, 在你的学习过程中, 搞清楚了 this 这个玩意, 那么会对你的开发生涯有很大帮助的 ● 接下来 阅读全文
posted @ 2023-04-18 13:15 可爱的小锋 阅读(40) 评论(0) 推荐(0)
摘要:koa中间件的实现原理如何?先来看一个例子。 koa的执行顺序是这样的: const middleware = async function (ctx, next) { console.log(1) await next() console.log(6) } const middleware2 = 阅读全文
posted @ 2023-02-21 18:12 可爱的小锋 阅读(86) 评论(0) 推荐(0)