前端
关注
分享
扫一扫
文章平均质量分 69
apple_2021
这个作者很懒，什么都没留下…
展开
-
初探Restful API
Restful API 从字面就可以知道，他是rest式的接口，所以就要先了解什么是rest。rest 不是一个技术，也不是一个协议。rest 指的是一组架构约束条件和原则，提供了一个新的架构设计思路，满足这些约束条件和原则的应用程序或设计就是 RESTful。在REST规则中，有两个基础概念：对象、行为。对象就是我们要操作的对象，例如添加用户的操作，那么对象就是user行为有4种常用的：查看、创建、编辑、删除GET 查看POST 创建PUT 编辑DELETE 删除。转载 2022-09-07 16:50:51 · 210 阅读 · 1 评论 -
fetch使用FormData表单提交踩坑记录
在react框架中，使用fetch进行表单提交（不是文件），之前都是json传参数。原创 2022-07-15 15:44:49 · 2742 阅读 · 0 评论 -
react-router-dom源码分析
Router 组件将 history 对象通过 Context 传递给下层的 Link 和 Route 组件；点击 Link 组件触发 history 对象的更新；Route 组件监听 history 对象的变化，拿到最新的路由信息和自身的 path 进行比较，如果匹配上就去渲染 component 或 render 属性指定的组件。...转载 2022-07-14 11:29:34 · 257 阅读 · 0 评论 -
安装create-react-app失败遇到的问题
解决方案总结转载 2022-05-12 15:49:57 · 404 阅读 · 0 评论 -
前端利用Blob对象实现下载html文件及踩坑记录
需要根据路径下载文件，之前只支持pdf，现在需要支持html文件下载原创 2022-04-27 10:39:23 · 1045 阅读 · 0 评论 -
react遍历对象生成dom
项目场景：目前有一个需求，是要接收后台返回的一个对象，并且遍历他的属性和值显示到页面上，因为该对象表示的是自定义参数，每一次都不一样，所以记录一下；问题描述之前最常用的map是方法是用来遍历数组的。const arr = [a, b, c]render(){ return ( <div> { arr.map((item,index)=>{ return ( <div key={index}>{item}</div> )原创 2022-04-11 19:14:05 · 2207 阅读 · 0 评论 -
[‘1‘, ‘2‘, ‘3‘].map(parseInt)的结果是什么？
发现一篇文章写的不错，推荐给大家。转载 2021-12-29 09:36:23 · 101 阅读 · 0 评论 -
websocket 在 react中的使用全过程
websocket的使用过程（前端视角）前一段时间需要做一个关于监控服务器的需求，如果某个服务器挂了就需要在前端展示，定时请求又很。。。就想到了 websocket 服务器自动推送的技术，记录一下我使用的全过程，希望对大家有帮助！原创 2021-12-23 09:24:39 · 7204 阅读 · 1 评论 -
js中Object.create作用，什么时候用？和new是什么区别
在javascript里类就是函数，声明一个类相当于声明一个类的构造函数。//声明一个类function Animal(name){ this.name=name;}//创建一个对象var cat=new Animal("Tom");new创建一个对象，执行构造函数。Object.create相当于创建一个对象，但是不执行构造函数。var cat1=new Animal("To...转载 2019-11-26 18:16:42 · 1163 阅读 · 0 评论 -
弹性盒模型（flex-box）
弹性盒模型（display：flex）在我们做移动端项目的时候，弹性盒模型经常会用到，初学者经常会搞不清它的属性。下面主要了解一下弹性盒子的五个属性。1. flex-direction：指定弹性子元素在父容器中的位置row：左对齐row-reverse：右对齐column：纵向对齐，即从上向下排列column-reverse：反转纵向对齐，即从下向上排列下面展示代码以及效果...原创 2019-11-26 11:34:14 · 1912 阅读 · 0 评论 -
["1", "2", "3"].map(parseInt)为什么是[1,NaN,NaN] ?
[“1”, “2”, “3”].map(parseInt)在学习前端中，我遇到了这么一道题。var a = ["1", "2", "3"].map(parseInt);console.log(a); // [1,NaN, NaN];下面我们看一下 map 和 parse 这两种方法1. mapmap函数的参数是一个函数。而传入的函数里一般需要一个或者两个参数。即var a = ...原创 2019-11-25 19:25:58 · 529 阅读 · 0 评论 -
构造函数，原型对象和实例对象的区别与联系
一. 构造函数用于创建对象的函数，一般首字母大写区别与一般函数。构造函数自带prototype属性，函数的prototype属性是个指针，该指针指向原型对象。二. 原型对象有constructor属性，这个指针指向相关联的构造函数三. 实例对象调用构造函数new’出来的对象，每个对象都有_proto_属性该属性指向构造函数的原型对象。我们看一个程序，理解一下。 ...原创 2019-09-26 12:30:59 · 905 阅读 · 1 评论 -
es6中let和const
一. let相当于var，但所声明的变量只在let命令所在的代码块中有限1. 变量不提升var 会进行变量提升（即没有声明就可以使用）<script> console.log(a); // undefined var a = 10;</script>let 如果在没有声明的时候使用，则系统会报错。<script> ...原创 2019-09-26 11:37:51 · 114 阅读 · 0 评论 -
前端性能优化之理解JavaScript的重排和重绘
一. 什么是重排，重绘 ？重排： 重新渲染DOM树。当渲染树中元素的布局，隐藏等发生改变时, 会发生重绘即回流(reflow)。每个页面至少需要一次回流，就是在页面第一次加载的时候。重绘：元素外观发生改变。当盒子的颜色、字体大小等发生改变时浏览器会重新绘制该元素，将内容呈现在页面上。(改变元素外观属性。如：color，background-color等会触发重排)重排必定会引发...原创 2019-09-25 18:20:44 · 318 阅读 · 0 评论 -
new操作符具体干了什么？（4个步骤）
一般要创建实例的时候，都要var obj = new 构造函数new操作符在这里主要做了四步创建一个空对象obj设置原型链 即 obj . _proto _ = 构造函数.prototype ;让构造函数中的this指向obj返回对象obj...原创 2019-09-23 23:29:25 · 1574 阅读 · 0 评论 -
js中函数重载详解以及两种实现方式
1. 什么是重载 ？函数或方法有相同的名称，但是参数序列却不相同，这种同名不同参数的函数或者方法称为重载。2. js中函数是否有重载呢 ？答案是没有，因为在js中，如果出现同名函数，后面的函数会覆盖前面的函数。代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-...原创 2019-09-23 23:20:56 · 1650 阅读 · 0 评论 -
改变this指向的三种方法，call，apply和bind的区别与联系
this指向（永远指向最后调用它的对象）一般直接调用函数时，this指向window。当事件调用函数时，this指向触发该事件的对象。而当调用对象的方法时，在函数中this指向拥有该方法的对象。但是call( )，apply( ) 和 bind( ) 都是Function的方法，所有函数都有这三个方法。1. 相同点都用来改变this的指向2.不同点接收参数的方式不同（1...原创 2019-09-23 22:48:39 · 2215 阅读 · 0 评论 -
cookie，localStorage和sessionStorage以及session的区别与联系
一.前端浏览器的三种缓存cookie，localStorage和sessionStorage共同点cookie，localStorage和sessionStorage都是保存在浏览器端，且是同源的不同点cookie数据在http请求中携带，在浏览器与服务器之间来回传输。sessionStorage和localStorage不会自动把数据给服务器发送，仅在本地保存，且存储大小比cook...原创 2019-09-21 15:08:07 · 506 阅读 · 0 评论 -
浅谈forEach( )，for in 和 for of 的区别
一般原创 2019-09-21 13:32:45 · 421 阅读 · 0 评论 -
深拷贝和浅拷贝的理解（js）
深拷贝与浅拷贝对象拷贝，就是把该对象的属性拷贝到新对象中（主要针对object和array这种复杂对象）浅拷贝：只是拷贝了基本数据类型的数据，而对于引用的数据类型，只是复制了地址，在新对象中引用型字段发生变化时，原对象会随之发生变化。因为指向同一个内存单元。深拷贝：是复制一个复杂对象，在内存中另开辟一个内存单元，新对象引用字段的变化不会影响原对象的值。实现思路以及代码：浅拷...原创 2019-09-21 12:25:38 · 374 阅读 · 0 评论 -
CSS中position定位的六种属性值
position是CSS中的一种属性，即定位。它可以使不同的元素处于不同的位置。它有六个取值，分别为：static、relative，absolute，fixed，inherit 和 sticky。position: static无定位（默认），当你没有为元素指定position时，则默认为static，元素正常出现在文档流中。position：relative相对定位，元素相对于...原创 2019-09-20 20:14:59 · 2665 阅读 · 0 评论 -
算法—JS生成随机密码
题目：输入一个正整数n，生成n个随机密码，其中包括数字，大小写字母。代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s...原创 2019-09-20 19:37:01 · 1286 阅读 · 0 评论 -
js中弹框的三种方式
alert（），confirm（），prompt（）三种弹框的区别JS中有三种弹框，主要是window的方法来实现与用户交互。下面我们看一下他们的具体样子和区别1.alert（）警告框主要是通过弹出一句话来提示用户。用户只能点击确认。形式为：alert（“文本”）或者alert（变量）。无返回值。<!DOCTYPE html><html lang="en">...原创 2019-09-18 21:22:45 · 1447 阅读 · 0 评论 -
BFC块级格式上下文
浅谈BFC,IFC,GFC,FFC格式化上下文BFCBFC布局规则1.内部的盒子会在垂直方向，一个个地放置2.垂直方向距离由margin决定3.每个元素的左边与包含该元素的左边相接触4.BFC区域不会与float重叠5.BFC是隔离的独立容器6.在计算BFC高度时，浮动元素也参与在内触发BFC布局1.body根元素2.浮动元素：float除none之外的值3.绝对...原创 2019-09-02 23:45:19 · 271 阅读 · 0 评论