- 博客(65)
- 收藏
- 关注
RSS订阅原创 REACT全家桶（6）----router
1.路由是根据不同的url地址展示不同的页面或者内容2.安装：https：//reacttraining.com/react-router/web/guides/quick-start。// 反向代理：将请求交给自己的后端，自己的后端去请求别人的后端，拿到数据后再返给自己的前端https：//facebook.github.io/create-react-app/docs/proxying-api-requests-in-development
2022-10-28 14:54:50
716
1
原创 REACT全家桶（5）----hooks
必须以“use”开头当我们想在两个函数之间共享逻辑时，我们会把它提取到第三个函数中再解释：将复杂代码封装到函数中。1.react-hooks解决了什么问题？完善函数组件的能力2.react-hooks如何模拟生命周期（1）模拟componentDidMount，useEffect依赖[ ]（2）模拟componentDidUpdate，useEffect无依赖，或者依赖[ a，b]（3）模拟componentWillMount，useEffect返回一个函数3.react-hook
2022-10-20 16:17:32
466
原创 REACT全家桶（4）----组件
初始化阶段：conmponentWillMount:组件即将挂载render：渲染componentDidMount：成功执行完毕render并完成dom节点的渲染，可以对dom修改运行中阶段：componentWillReceiveProps（next Props）：父组件修改属性触发ShouldComponentUpdate（next Props ， next State）：返回false，会阻止render的调用ComponentWillUpdate：组件将要更新，不能修改
2022-10-19 21:40:46
673
原创 REACT全家桶（3）----组件
组件化的概念代表页面中的某部分及功能特点：可复用、 独立。使用JS函数创建的组件函数名必须大写开头组件必须有返回值1.创建组件js文件，eg：Book.js2.在Book.js文件中导入React3.实用类或者函数创建组件4.组件必须要导出才能使用5.在指定的文件中导入Book.js6.渲染组件
2022-10-19 21:20:08
250
原创 REACT全家桶（2）---JSX
const title=你好bable进行编译，转成js对象，用R二act DOM.remder()方法将这个对象转成DOM元素，最后插入页面。如果元素没有子节点，可以直接使用单标签，但是以/>结尾。注意：不是两组花括号，外边代表是js，里边代表是对象。JSX不是ES的标准语法，它是ES的语法拓展。可以使用（）包裹JSX，以避免一些问题。可以使用if，三元运算符，逻辑运算符。语法：{JS表达式}
2022-10-19 19:16:15
181
原创 前端面试问题（5）
ShouldComponentUpdate（next Props ， next State）：返回false，会阻止render的调用。ComponentDidUpdate（preProps ，preState）：可以修改dom参数是被修改之后的属性及状态。Let：用于声明变量。使用let声明的变量属于顶层对象。fulfilled（完成，执行了resolve（））rejected（失败，reject（）执行）声明的变量不能重复声明。声明的变量不能提升变量。声明的变量能重复声明。声明的变量能提升变量。
2022-10-17 21:14:34
635
原创 REACT全家桶（1）
README.md 使用文档node-modules 所有的依赖安装目录package-lock.json 锁定依赖的版本号，团体开发时保持一致性package.json 项目的配置文件public 静态文件目录src 开发用源代码目录。
2022-10-11 19:59:28
884
原创 ES6知识点（4）
属性添加到constructor中。class的本质仍然是构造函数。this指向class的实例。// 碰撞检测 a b是两个dom元素。// 如果不是引用数据类型 直接返回值。必须包含constructor。使用构造函数（class）调用。
2022-10-06 17:33:28
561
原创 数据结构----链表、双向链表、集合
链表中的内容不必是连续的空间链表的每个元素都由一个存储元素本身的节点和一个指向下一个元素的引用组成在插入和删除数据时，事件复杂度可以达到O(1)访问元素需要从头访问LinkedList类内部有一个Node类，用于封装每一个节点上的信息保存两个属性，一个是链表的长度，一个是链表中的第一个节点append（el） 向列表尾部添加一个新的项insert（position，el） 向列表的特定位置插入一个新的项。
2022-10-06 09:36:47
463
原创 数据结构----队列结构Queue
一种受限的线性表，先进先出（FIFO），只允许在表的前端进行删除操作，在表的后端进行添加操作。每个元素不再只是一个数据而且包含数据的优先级，在添加方式中，根据优先级放入正确的位置。添加元素时，将新元素的优先级和队列中已经存在的优先级进行比较。普通队列插入一个元素，数据往往放在后边，但是优先级队列会考虑插入元素的数据优先级。dequeue（） 移出队列的第一项，并返回被移出的元素。front（） 返回队列中的第一个元素。// 将队列头部的数据放入队尾。
2022-10-05 21:08:19
532
原创 数据结构----stack
添加和删除操作时比较麻烦的，查看和修改时特别简单的。push（） 添加一个新的元素到栈顶pop（） 移出栈顶元素，同时返回被移出的元素peek（） 返回栈顶元素，不做任何修改size（） 返回栈里的元素个数isEmpty（） 是否为空，返回布尔值toString（） 将栈结构的内容以字符串形式返回
2022-10-05 20:52:33
509
原创 ES6知识点（3）
用于指定发生错误时的回调函数，最好是在.then()的链式调用最后调用一下此方法来捕获异常。fulfilled：完成，也就是执行了resolve()返回状态为rejected的Promise对象。rejected：失败，reject()执行。Promise实例。作用是将现有对象转换成Promise对象。状态的回调函数，第二个参数（可选）是。作用是为 Promise 实例添加。的返回值仍然是个Promise对象。.then()方法的第一个参数是。只要有一个返回结果，就输出它。状态改变时的回调函数。
2022-10-05 20:38:42
453
原创 ES6知识点（2）
对数组进行遍历，只要有一个满足条件，则返回true，并终止遍历，否则返回false（返回的是布尔值）对数组进行遍历，如果有一个满足条件，则返回false，并终止遍历，否则返回true。帮助数组遍历每一个key值和value值。原理：如果返回值为真，将元素放入新数组。检索数组是否包含某个值，返回的是布尔值。返回数组中第一个满足条件的元素的索引。原理：将计算后的结果放入新数组。返回数组中第一个满足条件的元素。帮助数组遍历所有的key值。数组遍历，返回值是一个和。Object:构造函数。
2022-10-05 20:21:29
1165
原创 ES6知识点（1）
箭头函数中的this指向函数所在作用域的上下文。2.arguments与args的区别。特性：this指向函数所在的作用域。将数组、类数组展开以逗号隔开的列表。（2）比较流氓的深拷贝（JSON）let 面向对象 闭包。arguments是类数组。事件绑定不要用箭头函数。（1）流于表面的深拷贝。（3）流于表面的深拷贝。实例方法：实例对象调用。静态方法：构造函数调用。foreach：数组。
2022-09-30 14:12:24
623
原创 前端面试问题（4）
10.lastIndexOf() 从后向前查找或者获取某元素的索引值 如果找不到 得到的值就是-1 (从后往前只获取最后一个)9.indexOf() 从前向后查找或者获取某元素的索引值 如果找不到 得到的值就是-1 (从前往后只获取第一个)2.添加 push(向数组最后面添加) 、 unshift(向数组最前面添加) ， 会改变原数组。3.删除 pop(删除数组的最后一项) 、 shift(删除数组最前面的一项) ，会改变原数组。//替换 splice(下标，删除的个数，替换的项)
2022-09-28 20:20:29
605
原创 前端面试问题(3)
先在自己的构造函数中寻找，如果没有就到自己的原型中寻找，如果还没有就到原型的原型中寻找，一直到找到object的原型，如果没有就报错。减少重绘和回流次数，多使用类来修改样式，减少内联样式修改。把事件添加给标签的父元素，通过事件对象e.target来实现具体的操作。数据存储在本地，（没有过期时间）需要手动删除，存储量大。）返回从start位置开始到end位置的子串（不包含end）减少网络请求次数（节流）html角度：多使用语义化标签，减少标签层级化嵌套。可以为数据设置过期时间，存储量小，可以与后台共用。
2022-09-28 20:01:15
477
原创 正则表达式
// 创建正则表达式 //1. 字面量字符 //var reg=new RegExp("a") var reg=/a/ console.log( reg.test("aaa")); // 2.字符 代表除了某些特殊符号的任意字符 var reg=/a.c/ console.log(reg.test("a.c")); // 3. ^ & | var reg=/^A|a$/ console.log(reg.test("bca"))
2022-09-28 17:43:05
330
原创 前端面试知识点
BFC名为 “块级格式化上下文”，简单来说就是，BFC是一个完全独立的空间（布局环境），让空间里的子元素不会影响到外面的布局。substring（start，end）返回从start位置开始到end位置的子串（不包含end）substr（start，length）返回从start位置开始length长度的子串。new的工作原理（流程）：使用new去调用一个函数，new做了一下四步。（2）动态向父元素后面添加一个clear：both的块属性元素。（1）创建一个空对象{ }原型（该类的存储空间）
2022-09-28 17:39:44
268
原创 JS案例----轮播图
var s = -1 * targetIndex * myWidth - dSwiper.offsetLeft //路程。var t = 20 //swiperTimer执行20次完成图片切换。var shouwIndex = 1 //当前显示图片的下标。var swiperTimer = null //切换。var autoCount = 0 //自动轮播计数。//需要跳转到第二张。var count = 0 //计数。var timer = null //每五秒。-- 显示点 -->
2022-09-28 17:21:21
1924
原创 AJAX知识点及其用法
/ xhr.open(请求方式,请求地址,是否异步)比如alert弹窗，登录注册流程。比如图片加载，上传下载等任务。// 创建ajax 四步。：上一个任务结束下一个再开始。：按顺序开始不一定按顺序结束。
2022-09-27 09:54:45
226
原创 JQ----动画
d.animate({ left:'50px', top:'50px'} ,2000) 原生jq动画，不支持颜色。连缀 d.animate().animate().animate()列队动画 ： 回调 d.animate({},fn(){})sildeToggle() 展开或收起。fadeToggle() 淡入或淡出。动画控制：stop() 暂停。fadeIn() 淡入。hide() 隐藏。fadeOut() 淡出。
2022-09-27 09:46:00
285
原创 JQ----事件
绑定事件 可同时添加多个事件。删除事件(全部删除) 如果删除某一个事件括号传入指定值。冒泡：e.stopPropagation()默认：e.preventDefault()JQ不支持滚轮事件，只能用JS来写。timeStamp 获取时间戳。
2022-09-27 09:31:46
123
原创 JQ----DOM
div.html() 获取div的html内容div.text() 获取div的文本内容inp.val() 获取inp的文本内容$("") 创建元素div.append(p) 拼接元素：p放到div中p.appendTo(div) 同上a.prepend(b) 插入到最前面 a是父级，b是子级a.prependTo(b) 插入到最前面
2022-09-26 15:37:03
225
原创 JQ----筛选
first() 第一个last() 最后一个find() 寻找子级（类似于后代选择器）eq(n) 第n个not(x) 没有x描述的filter() 过滤slice() 剪裁has() 过滤（检索的是集合中DOM算的后代）children() 子级（不包含子代的后代）parent() 直接父级parents() 所有父级parentUntil(x) 直到找到x描述的父级停止offsetParent() 第一个定位的父级next() 下一个nextAll() 后边所有
2022-09-22 17:04:23
156
原创 JQ----css
获取top和left值。获取top和left值。css('color') 获取样式值。scrollLeft() 获取滚动的值。scrollTop() 获取滚动的值。css('color','red') 设置样式值。
2022-09-21 15:56:35
87
原创 JQ----选择器
id #div1标签名 divclass .div1后代选择器 header div $(“header div”）等价于$("header").find("div")子代选择器 header>div $("header>div")等价于$("header").children('p')
2022-09-21 15:04:48
151
原创 JQ----属性
removeAttr（'title') 移除属性值addClass（’page‘） 添加class值removeClass（’page‘） 移除class值toggleClass（’hah‘）
2022-09-21 14:54:50
113
原创 JQ----基础核心
onload方法与ready方法的区别onload：全部资源加载完毕只能执行一次，会覆盖前边的不能简写ready：DOM结构加载完毕可多次执行可简写$(function(){});效率更高非破坏性操作：this指向原来的jq对象破坏性操作：this指向新的jq对象
2022-09-21 14:43:14
179
原创 前端面试十个问题（2）
（1）通过a标签或者.location.href添加数据，在其他页面可以用location.search获取。数组进行第二遍遍历，按照规则，第二大的数字就会跑到倒数第二大的位置。把事件添加给标签的父元素，通过事件对象e.target来实现具体操作。1.思想：两两比较，交换位置，小的在前面，大的在后面，一直比较。函数内实现另一个函数，局部变量数据持久化，造成一定的内存压力。rem：1rem=根标签字体的大小(html字体的大小)em：1em=父级标签字体的大小。（2）通过数据存储手段。深拷贝：堆内存的内容。
2022-09-21 14:29:03
183
原创 JQ----基础
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（框架）于2006年1月由John Resig发布。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
2022-09-17 20:20:47
69
原创 js----事件案例----上次传头像
var ipt=document.querySelector('input') var dHeadPic=document.querySelector(".head_pic") ipt.onchange=function(){ // 选择的图片 var file=this.files[0]; // 创建一个文件读取对象 var reader=new FileReader() reader.
2022-09-17 20:06:38
71
原创 js----事件案例----滚轮缩放图片
var nowScale=1.0 //当前的缩放倍数。var maxScale=3.0 //最大的缩放倍数。var minScale=0.25 //最小的缩放倍数。// 规定：向上滑动 放大；
2022-09-17 20:02:59
307
原创 面向对象OOP（3）
//1. 数组去重 Array.prototype.SingleArr=function(){ var newArr=[] this.forEach(function(item){ newArr.indexOf(item)===-1?newArr.push(item):null; }) return newArr; }
2022-09-17 19:57:46
48
原创 面向对象OOP（2）
1.for in 只能拷贝第一层深拷贝，如果里边的数据是引用数据类型，就是浅拷贝了。构造函数主要通过 call() 或者 apply() 实现。原型：该类的公共空间，本质是一个对象，作用是节省内存。call(this,参数1，参数2，......)apply(this，[参数列表])原型需要使用构造函数的名字来调用。原型的继承需要使用深拷贝来继承。：将一堆属性方法结合在一起。工作原理：改变this指向。：多种形（参数不能重复）
2022-09-16 21:00:03
48
原创 面向对象OOP（1）
var b=createBook("我替你记得",25,"叙事");// 不要把函数或公共资源写在构造函数里，容易造成内存的浪费。description:"105个男人与3个女人的故事",// this指向函数的拥有者。obj.name='肉食动物';author:"施耐庵"// 构造函数：开辟内存空间。// 析构函数：释放内存空间。
2022-09-15 21:44:12
60
原创 前端面试的十个问题
/用新的数组去遍历旧的数组中的每一项 如果没有 就添加。viewport：初始化页面元素，防止页面被缩放，规范用户操作。正常盒模型设置padding和border会增大盒模型面积。//第四种：set() 会得到一个单一结构的数据。好处或优点：在没有css样式的情况下对代码结构一目了然；src：用来放置图片地址（相对地址、绝对地址、网络地址）//第三种：include 得到的是布尔值。===：数据类型和值必须都相等。提交地址属性：action。基本数据类型：值在栈区。引用数据类型：值在堆区。
2022-09-15 21:38:42
137
原创 web----新标签
什么是语义化，有什么好处？语义化：标签名字有意义好处或优点：在没有css样式的情况下对代码结构一目了然； 有利于SEO（网络引擎搜索优化）
2022-09-15 21:26:39
245
原创 web----响应式布局、em和rem、媒体查询
初始化页面元素，防止页面被缩放，规范用户操作。相对于最近的父元素的font-size的大小。/* 隐藏标签 */相对于html的font-size的大小。
2022-09-15 21:17:27
132
原创 web----响应式----百分比布局
2.left和right相对于定位父元素的宽度 top和bottom相对于定位父元素的高度。vw和vh相对于浏览器可视窗口 和父元素没有关系（%看父元素大小 vh和%作用一样）1.宽高设置百分比相对于父元素的宽高。2.margin和padding相对于父元素的宽度。1.宽高设置百分比相对于定位父元素的宽高。
2022-09-15 21:10:58
362
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人