欢lele-优快云博客

原创【REACT-router】

spa应用，在任意js或者css代码都相当于在head标签中引入，如果是多组件或者多人开发如何避免冲突，建议每一个组件都可以放入一个同名文件夹中，这样js与css在一起。css命名的时候写成：A.moudle.css.这样这个css样式只对A起作用，注意不要单独写标签名选择器。如果我们不想让用户访问某个路由或者该路由不在我们书写的路由中，我们可以让组件跳转到我们指定的路由。动态路由：代表动态，id可以被替换，在props.match.params中获取。建议：将路由单独封装在一个js文件中。

2022-10-28 10:59:33 232

原创【REACT-hooks】

3.写出function组件，无状态组件，但是有需要状态，改成class组件成本太高（不存在生命周期）当我们想在两个函数之间共享逻辑时，我们会把它提取到第三个函数中。第二个参数如果是空数组，那么第一个参数只走一次。如果传入空数组，函数首次执行生成，之后不变。1.高阶组件为了复用，导致代码层级复杂。如果[name]name作为依赖存在，只有name改变，函数才会重新执行一次。如果不传数组，每次都会生成新的函数。只要被修改，第一个参数就会走一次。在解释：将复杂代码封装到函数中。必须以“use”开头。

2022-10-19 21:23:58 267

原创【前端面试题7】

ShouldComponentUpdate（nextProps ， nextState）：返回false，会阻止render的调用。componentDidUpdate（preProps ，preState）：可以修改dom参数是被修改之后的属性及状态。（ref是React提供的用来操纵React组件实例或者DOM元素的接口。如果标记在标签上就获取标签，如果标记在属性上就获取属性。fulfilled（完成，执行了resolve（））rejected（失败，reject（）执行）声明的变量不能重复声明。

2022-10-17 21:57:48 143

原创【REACT-04组件】

表单受控组件：1.由React控制2.value绑定state中的值3.实现表单元素的change事件4.优化：可以使用name属性，统一完成change事件5.注意：选择框与其他表单元素获取的值方式不一样非受控组件：由DOM控制在constructor中React.createRet（）一、通信1.父传子：属性值2.子传父：回调函数3.在父组件中对子组件进行ref标记，可以获得到子组件的引用4.中间人模式：由父组件充电中间人，利用子传父+父传子

2022-10-11 22:34:43 259

原创【REACT-03组件】

React并不会真的绑定一个事件到具体的元素上，而是采用事件代理的模式。使用js原生的map方法，为了列表的复用性，设置key值，提高性能。外部导入：准备好外部css文件，在js中使用import引入。类组件应继承React.Component父类。3.2在Book.js文件中导入React。3.5在指定的文件中导入Book.js。类组件必须提供render()方法。概念：代表页面中的某部分及功能。3.4组件必须要导出才能使用。使用JS函数创建的组件。3.1创建组件js文件。行内样式（官方推荐）

2022-10-11 21:37:47 322

原创【REACT全家桶-02JSX】

const title=你好bable进行编译，转成js对象，用R二act DOM.remder()方法将这个对象转成DOM元素，最后插入页面。如果元素没有子节点，可以直接使用单标签，但是以/>结尾。注意：不是两组花括号，外边代表是js，里边代表是对象。JSX不是ES的标准语法，它是ES的语法拓展。可以使用（）包裹JSX，以避免一些问题。可以使用if，三元运算符，逻辑运算符。5.1行内样式 style。

2022-10-11 20:06:18 345

原创【REACT全家桶-01】

package-lock.json:锁定依赖的版本号，团队开发时保持一致性。：把真实DOM树转成对象树，再通过diff算法，减少重绘回流。：起源于Facebook，于2013年5月开源。node_modules: 所有依赖安装目录。package.json:项目的配置文件。README.md:使用文档。public：静态文件目录。src：开发用源代码目录。高效，减少dom操作。JSX，JS扩展语法。

2022-10-11 19:40:50 164

原创【数据结构】【链表】【双向链表】【集合】

size（）链表中元素的个数。indexOf（el）返回元素在列表中的索引。indexOf（el）返回元素在列表中的索引。values（）返回一个包含集合中所有元素的数组。insert（position，el）向列表的特定位置插入一个新的项。removeAt（position）从列表的特定位置删除一项。

2022-10-11 09:54:39 152

原创【数据结构】【栈】【队列结构Queue】

队列结构Queue的特性：一种受限的线性表，先进先出（FIFO），只允许在表的前端进行删除操作，在表的后端进行添加操作。优先级队列：普通队列插入一个元素，数据往往放在后边，但是优先级队列会考虑插入元素的数据优先级。问题：每个元素不再只是一个数据而且包含数据的优先级，在添加方式中，根据优先级放入正确的位置。添加元素时，将新元素的优先级和队列中已经存在的优先级进行比较。dequeue（）移出队列的第一项，并返回被移出的元素。pop（）移出栈顶元素，同时返回被移出的元素。

2022-10-09 22:31:35 85

原创【ES6】【SET数据结构】【Promise】【class】

作用：防止出现回调地狱，提高代码的可读性，像同步操作那样去执行异步操作。模块化：一个大的文件划分为多个小文件，每一个小文件就是模块化。fulfilled：完成，也就是执行了resolve（）delete(x):x不是索引，而是在set中具体的值。好处：进行逻辑分离，提高代码的独立性和复用性，可读性。clear(x):不需要参数，清除所有的成员。rejected：失败，reject（）执行。has(x):验证是否存在，返回布尔值。类似于数组，但是成员唯一，没有索引。pending：执行中。

2022-10-09 22:08:29 199

原创【ES6】【数组的新特性】【对象的新增特性】

对数组进行遍历，只要有一个满足条件，则返回true，并终止遍历，否则返回false（返回的是布尔值）对数组进行遍历，如果有一个满足条件，则返回false，并终止遍历，否则返回true。帮助数组遍历每一个key值和value值。原理：如果返回值为真，将元素放入新数组。检索数组是否包含某个值，返回的是布尔值。返回数组中第一个满足条件的元素的索引。原理：将计算后的结果放入新数组。单核：同时执行一个任务，单线程。多核：同时执行多个任务，多线程。数组遍历，返回值是一个和。Object:构造函数。

2022-10-09 21:36:55 337

原创【ES6】【let和const的作用】【箭头函数】

模板字符串包含：反引号用法，可以插入变量、函数，定义比较长、复杂的字符串。findIndex（callback）：返回数组中第一个满足条件的元素索引。扩展运算符：相对于rest方法的逆运算，把数组转换为逗号隔开参数列表。Array.of()将参数列表返回一个数组，相对于创建数组。find（callback）：返回数组中第一个满足条件的元素。includes（）：检索数组是否包含某个值，返回布尔值。for in：用于数组与对象，获取的是key。for of：纯数组与类数组的集合均可遍历。

2022-09-30 14:30:55 280

原创【前端面试考点】

基于代码层面的封装，分属同一功能/业务的代码进行分装成独立的模块，可以独立的运行，以页面、功能或其他不同粒度划分程度不同的模块，模块间通过接口调用，目的是降低模块间的耦合。语言在编译前就把数据类型确定了，被确定了数据类型的变量，如果不强制转换，就永远是给定的数据类型。语言是在编译后确定数据类型，没有明显的类型，他能随着环境的不同，自动变换类型。面试题：在不使用第三个变量的情况下交换两个变量值。1.filter-过滤工作原理。let 面向对象闭包。实例方法：pop...实例方法：实例对象调用。

2022-09-29 17:21:51 451

原创【前端面试题6】

js：减少for循环嵌套，适当使用switch，减少重绘重排次数（多使用类修改，减少内联样式的修改），少用load，使用ready，减少网络请求次数，按需加载。//添加 push（向数组最后面添加） unshift（向数组最前面添加）会改变原数组。//pop 删除数组的最后一项 shift删除数组的最前面一项会改变原数组。//5.拼接数组 concat（）返回新的数组不会改变原数组。//6.截取数组 slice（）返回新的数组不会改变原数组。css：减少动画使用，适当使用服务器字体，使用精灵图。

2022-09-28 20:49:33 481

原创【前端面试题5】

先在自己的构造函数中寻找，如果没有就到自己的原型中寻找，如果还没有就到原型的原型中寻找，一直找到object的原型，如果还没有就报错。sessionStroage：数据依赖浏览器，当页面关闭或者退出浏览器时清空数据，存储量大。绝对定位：相对于有定位的父元素或祖先元素，如果都没有就相对于body。localStroage：数据存储在本地，需要手动删除，存储量大。cookie：可以为数据设置过期时间，存储量小，可以与后台共用。call（this，参数1，参数2）相对定位：相对于元素原来的位置。

2022-09-28 19:56:02 269

原创【ES5】【字符串方法】【数组方法】【Math方法】

8.替换字符串 replace(旧的字符新的字符)，replace只替换第一个 repalceAll替换所有的。两个参数截取的是一个范围包括开始位置不包括结束位置。4.substring 截取字符串获取的是一个范围。7.获取时间戳（距离1970.1.1的毫秒数）2.获取年份:getFullYear()6.trim() 删除字符串前后的空格。3.获取月份:getMonth()10 parseInt 取整。4.获取日期:getDate()4.返回几个数中的求最大值。5.获取周几:getDay()

2022-09-27 14:50:33 355

原创【AJAX】

同步：上一个任务结束，下一个在开始，比如alert弹窗，登录注册流程。异步：按顺序开始，不一定按顺序结束，比如图片加载，上传下载等任务。url：请求地址协议+域名/IP：port+路由。_.open(请求方式，请求地址，是否异步)：在不刷新网页的情况下去更新数据。success：成功回调函数。isAsync：是否异步。error：失败回调。

2022-09-24 12:12:35 103

原创【JQ】【动画】【事件】

show() 显示hide() 隐藏toggle() 显示或隐藏slideDown() 向下展开slideUp() 向上收起slideToggle() 展开或收起fadeInIn() 淡入fadeOut() 淡出fadeToggle() 淡入或淡出fadeTo() 渐变到一定程度

2022-09-22 18:54:12 245

原创【JQ筛选】【DOM】

first() 第一个last() 最后一个find() 寻找子级，类似于后代选择器eq() 第n个not() 没有x描述的filter() 过滤slice() 裁剪has() 过滤，检索的是集合中DOM算的后代children() 子级（不包含子级的后代）parent() 直接父级parents() 所有父级parentUntil(x) 直到找到x描述的父级停止offsetParent() 第一个定位的父级next() 下一个nextAll() 后边所有nestUntil(x

2022-09-22 17:09:22 228

原创【JQ属性】【css】

attr('title') 获取属性值attr（‘title’，‘hahhaha’）设置属性值attr（{title：‘enenen’，style：‘background-color：red’}）同时设置多个属性值removeAttr（‘title’）移除属性值addClass（‘page’）添加属性值removeClass（‘page’）移除class值toggleClass（‘hah’）添加或者移除class值

2022-09-21 16:11:14 214

原创【JQ】【基础核心】【选择器】

1.3$("#div1").css('color','red'):添加内联样式。1.1$(function(){}) :匿名函数的执行。1.4$==JQurey :js封装好的一个对象。这里互换指JQurey对象与DOM对象id。容错功能，很多情况下动态DOM生成会有问题。选择器复杂度，选择器越复杂，字符串解析越慢。1.2$("#div1"):选取元素。可简写$(function(){})1.最核心，选择器引擎。

2022-09-21 15:56:42 184

原创【前端面试题4】

存在问题：父元素不设置高度的情况下，高度由子元素撑开，一旦子元素设置浮动，父元素会失去高度进而影响后面元素布局。4.1上下两个元素同时设置margin-top和margin-bottom会叠压取最大值。盒模型包括：width+height+marign+padding+border。支持设置宽高，如果不设置宽高，宽度自动撑满父容器，高度由内容决定。4.2第一个子元素的margin-top会传递给父元素。动态向父元素后面添加一个clear：bot的块属性元素。7.1固定定位 position:fixed。

2022-09-21 15:29:24 253

原创【前端面试题3】

7.3.通过class名获取元素document.getElementsByClassName()lastindexOf()从后向前查找或者获取某个元素的索引值，如果找不到，得到的值就是-1。indexOf()从前向后查找或者获取某个元素的索引值，如果找不到，得到的值就是-1。7.2.通过标签名获取document.getElementsTagName()7.5.通过选择器获取document.querySelectorAll()7.1.通过id名获取document.getElementById()

2022-09-21 15:03:58 197

原创【前端面试题2】

1.1通过a标签或者.location.href添加数据，在其他页面可以用location.search获取。把事件添加给标签的父元素，通过e.target来实现具体操作。阻止冒泡：e.stopPropagation()阻止默认：e.preventDefault()DOM2同一个事件可以添加多个观察者。DOM0同一个事件只能实现一次。1em：父级标签字体的大小。1rem：根标签字体大小。1.2通过数据存储手段。函数内部实现另一个函数。

2022-09-21 14:28:21 139

原创【前端面试题1】

JSON是一种特殊格式的字符串，可以与数组，对象进行转换，常用于前后端数据交互，文件配置说明。2.sessionStorage数据依赖浏览器，当页面关闭或者退出浏览器时清空数据，存储量大。把事件添加给标签的父元素，通过事件对象e.target来实现具体操作。3.cookie 可以为数据设置过期时间，存储量小，可以与后台共用。函数内实现另一个函数，局部变量数据持久化，造成一定内存压力。8.事件冒泡:同类型事件，子级向父级传递。9.事件捕获：同类型事件，父级向子级传递。change：内容被修改并且失去焦点。

2022-09-17 20:28:30 58

原创【前端面试题】【交互】

先在自己的构造函数中寻找，如果没有就到自己的原型中寻找，如果还没有，就到原型的原型中寻找，一直找到object的原型，如果还没有就报错。substring(a,b),可以从下标为a的位置开始截取，一直截取到下标为b-1的位置，（取头取不到尾）substr(a,b),可以从下标为a的位置开始截取，一直截取到下标为b的位置，（取头取尾）（3）将构造函数的作用域赋给这个对象，将构造函数中this指向该对象。作用：公共资源写在原型中，原型是一块独立的内存空间，本质是对象。冒泡：文档从目标节点到根节点（从下到上）

2022-09-17 20:27:01 283

原创【前端面试题】【布局】【样式】

如何跨页面传值：location.href,location.search,localStorage,sessionStorage,cookie。inline-block，默认下边会有一个白边 ——解决方式：改成block，使用浮动，定位，弹性。BFC：块格式化上下文，可以解决垂直外边距重叠问题，去除浮动，自适应两列布局问题。伪类的执行顺序：link ：visited ：hover ：active。清除浮动：为了解决父元素因为子级元素浮动而引起的内部高度为0的问题。只给高度或宽度，会等比例变化。

2022-09-16 21:40:53 463

原创【Math对象方法】【定时器】

setTimeout（callback，time）延迟固定时间执行一次只执行一次。setInterval(callback，time) 每隔固定时间代码执行一次。callback:回调函数：把函数当作一个参数传递到另一个函数中。clearTimeout(time2) 移除延时器。3.求某个数的算数平方根 Math.sprt。2.返回x的y次幂 Math.pow。1.取绝对值 Math.abs()10 parseInt 取整。4.返回几个数中的求最大值。5.返回几个数中的最小值。6.四舍五入得到是整数。

2022-09-15 21:39:36 415

原创【函数】【tab选项卡例子】

声明函数：function（）函数名（形参）{调用函数执行代码}提高代码利用率，分隔作用域，防止命名冲突，释放内存。7.回调函数：把函数当作参数传递到另一个函数中。全局变量：定义在函数外面的变量就是全局变量。局部变量：定义在函数内部的变量就是局部变量。声明函数：functio 函数名（）{}（function（形参）{}（实参））5.arguments函数内置数组。8.递归函数：在函数本身调用自己。实现某个功能的代码组合。调用函数：函数名（）

2022-09-15 21:38:12 77

原创【获取元素大小】【属性方法】【overflow使用】【scroll使用】

scrollHeight当子元素超出父元素大小子元素的height+padding+border+margin-top+父元素border。scrollWidth当子元素超出父元素大小子元素的width+padding+border+margin-left+父元素border。setAttribute 设置属性标签本身有的属性和自定义属性都可以体现。offsetLeft:获取元素距离元素左边框距离左边的距离。offsetTop:获取元素距离元素上边框距离上边的距离。

2022-09-15 21:31:25 256

原创【字符串方法】

replace(旧的字符新的字符)，replace只替换第一个 repalceAll替换所有的。tolowerCsae将大写转小写 toUpperCsae将小写转大写。两个参数截取的是一个范围包括开始位置不包括结束位置。：根据索引取出对应的字符索引也是从0开始。一个参数截取索引开始位置一直到结束。截取字符串获取的是一个范围。删除字符串前后的空格。

2022-09-15 21:28:14 83

原创【DOM】【属性】【方法】【添加】【替换】【删除】【克隆】

appendChild() 父元素.appendChild(新节点) 向当前节点末尾添加节点。cloneNode（布尔值）true克隆节点 false不克隆节点默认不克隆。2.docum.createElement（“节点名称”）创建节点。3.childNodes 返回所有子节点得到是一个类数组。7.lastElementChild 返回最后一个子节点。父元素.replaceChild（新节点，替换节点）2.parentNode 返回当前节点的父级节点。6.lastchild 返回最后一个子节点。

2022-09-15 21:20:44 65

原创【EVENT】【protocal】【闭包】【事件委托】

通过事件e.target来实现具体操作。把事件添加给标签的父元素。函数内部实现另一个函数。

2022-09-15 21:12:16 55

原创【EVENT】【表单】【存储】

什么是JSON：是一种特殊格式的字符串，可以与数组，对象进行交换，常用与前后端的数据交互，文件配置说明。2.数据依赖浏览器，当页面关闭或者退出浏览器清空数据。1.数据存储在本地没有过期时间需要手动删除。form.submit 执行form表单数据提交。1.locationStorage本地存储。2.sessionStorage会话存储。JSON.parse() //字符串转化数组。change :内容被修改并且失去焦点。3.存储量小，可以与后台共用。3.为数据设置过期时间。input：内容被修改。

2022-09-15 21:08:22 198

空空如也

空空如也