自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(44)
  • 收藏
  • 关注

原创 mac上安装node和n

这三个链接说的很清楚:1.Mac 安装 homebrew 流程 以及 停在 Updating Homebrew等 错误解决方法https://zhuanlan.zhihu.com/p/849238332.在mac上安装node.jshttps://www.jianshu.com/p/3b30c4c846d1个人比较喜欢使用安装包的形式安装3.n的安装,用来控制node版本https://www.jianshu.com/p/c641dcc47b48...

2021-06-16 20:55:40 508

原创 常用git命令

切换分支,在自己分支上开发:git checkout origin/master -b feat-checkbox //切换分支创建并且切换到分支里: git checkout -b 分支名

2021-06-16 20:47:25 129

转载 JS的垃圾回收机制

JS拥有垃圾回收机制:对于C、C++来说,程序员需要自己跟踪内存。JS就省事多了,执行环境会自动管理内存,也就是会自动的负责分配内存和回收闲置资源。所以需要知道某个内存是否还在用并且在不用的时候如何清理,有两种标记策略:标记清理和引用计数。标记清理(常用)步骤:垃圾回收器找到根并标记再标记根直接引用的对象再标记引用对象的引用将不可访问的(不可达)的对象删除具体算法:几种垃圾回收算法这篇文章来源:前端面试:谈谈 JS 垃圾回收机制引用计数思路是:对每个值都记录它

2021-03-26 13:44:10 125

原创 类的静态属性和静态方法(待补充...)

静态属性有什么用?对比来说:一般属性,他的值是隶属于该类的具体某个对象(虽然定义在类中),或者说,每个对象的同样的属性的值,有可能不一样。静态属性就是:只隶属于类本身——也可以看做是所有对象的“共有数据”。...

2021-03-26 11:39:17 99

原创 如何判断一个数组

方法一: 用 InstanceOfvar arr=[1,2,3];console.log(arr instanceOf Array)方法二: 用 constructor 属性var arr=[1,2,3];console.log(arr.constructor==Array)方法三: 用Object.prototype.toString.call()arr=[1,2,3]console.log(Object.prototype.toString.call(arr));方法四:isAr

2021-03-17 10:50:23 190

原创 数组去重

方法一:常规方法思想是新创建一个数组,这个数组有的元素不添加,没有的则添加function quchong(arr1){ var arr2=[]; for(let i=0;i<arr1.length;i++){ if(arr2.indexOf(arr1[i])===-1){ arr2.push(arr[i]); } } return arr2;}var arr=[2,1,1,1,3,3,4,5,6,6];console

2021-03-16 13:52:25 86

原创 快速排序

中心思想:找一个基准(一般是最中间的数),将大于基准的数排在基准右边,小于基准的数排在基准左边。 function quickSort(arr,left,right){ var index; if(arr.length>1){ index=partition(arr,left,right); if(left<index-1){ quickSort

2021-03-14 18:40:06 67

原创 字节2018前端笔试

题目如:读题读了挺长时间的…意思是在第二行的数组中找从第四行第一个数和第二个数之间存不存在第三个数我刚开始的思路就是进行遍历嘛,直接暴力解法,上代码:得了15分,满分25分,原因是对于一部分case超时啦于是看了下评论部分的讲解,掌握了一种新方法,虽然以前也用过,类似于map(存键值对的数据结构)但是很多面试不支持用ES6。所以只能用数组模拟map讲解:将喜好值作为数组的下标,把具有相同喜好值位置的下标加到数组中自己实现了一遍: var userNums = parseI

2021-03-14 16:51:54 236

原创 总结数组易混淆却常用的方法

splice()1.A.splice(n,num)用于截取数组,从第n个起截取num个元素返回到新数组,且原数组变化。可以理解为删除数组中任意位置的元素 //从第二个起删两个 var a=[1,2,3,4,5]; console.log(a.splice(2,2));//[3,4] console.log(a)//[1,2,5] var b=[1,2,3,4,5,6]; a.splice(2,2,1,1) console.log(a)//[1,

2021-03-14 13:05:12 110

转载 迭代器函数

every(判断函数)作用:数组中每一项都会去执行every里的函数,但是只有每一项返回true最终才会返回true var a = [1, 2, 3, 4, 5, 6]; var b=a.every((n) => { console.log(n);//1(迭代结束) return (n%2==0); }) console.log(b)//falsesome(判断函数)作用:数组中每一项都会去执行some里的函数,但是只有一项返回

2021-03-13 21:18:00 366

原创 归并排序

归并排序使用了分治思想。将数组分成一个一个的小数组,一个数组只有一个元素。再合并。function mergeSort(arr){ var length=arr.length; if(length==1){ return arr; } var mid=Math.floor(length/2); var leftarr=arr.slice(0,mid); var rightarr=arr.slice(mid,length); return merge(mergeSor

2021-03-11 21:53:38 61

原创 堆排序

构建大顶堆或者小顶堆----将堆头和堆尾交换----继续构建剩下元素的大顶堆或者小顶堆----再交换----再构建…function heapsort(arr){ var heapSize=arr.length; buildHeap(arr);//构建大顶堆 while(heapSize>0){ heapSize--; [arr[0],arr[heapSize]]=[arr[heapSize],arr[0]];//交换 heap

2021-03-11 21:19:17 64

原创 插入排序

核心思想:先假设第一个已经排好了,从第二个起,开始和前面的比较,如果比前面的大,就将前面的往后移动,直到前面某个比这个数小。这张图片贼棒此图说明一切function insertsort(arr){ for(let i=1;i<arr.length;i++){ var temp=arr[i]; var j=i; while(j>0&&temp<arr[j-1]){ arr[j]=arr[j

2021-03-11 19:11:34 61

原创 选择查找

核心思想:找到一组数中的最小值,将其与第一个交换。再找从第二个开始的数组中的最小值,再与第二个交换…比如[5,4,3,2,1],最小值为1,第一次交换完为[1,4,3,2,5],最小值为2,2和4交换为[1,2,3,4,5]代码为:function selectionSort(arr){ for(let i=0;i<arr.length;i++){ var index; var min=arr[i]; for(let j=i;j

2021-03-11 17:04:30 223

原创 二分查找

上代码://折半查找,也叫二分查找function binerySearch(arr,num){ var left=0; var right=arr.length-1; while(left<=right){ var mid=Math.floor(left+(right-left)/2); if(arr[mid]<num){ left=mid+1; }else if(arr[mid]>num

2021-03-11 16:44:05 67

转载 sass/scss和less的区别

Sass/Scss、Less是什么?Sass (Syntactically Awesome Stylesheets)是一种动态样式语言,Sass语法属于缩排语法,比css比多出好些功能(如变量、嵌套、运算,混入(Mixin)、继承、颜色处理,函数等),更容易阅读。Sass与Scss是什么关系?Sass的缩排语法,对于写惯css前端的web开发者来说很不直观,也不能将css代码加入到Sass里面,因此sass语法进行了改良,Sass 3就变成了Scss(sassy css)。与原来的语法兼容,只是用{}

2021-03-11 10:17:42 130

原创 输入一个URL会发生什么?

全当自己理解写的:1.当用户输入了一个URL地址,首先浏览器要发送http请求报文,且发送这个报文是需要开一个网络线程的。2.这时候会进行DNS查询,获得IP地址(浏览器—本地—DNS域名服务器),这个过程很慢,可以进行dns-prefetch优化。3.在传输层会建立tcp连接,三次握手。4.再往下,网络层会IP寻址。数据链路层封装成帧,物理层再进行传输。5.服务器收到请求报文,会根据负载均衡分配到合适的服务器进行处理6.如果是短连接就会返回响应。如果是长连接的话会继续往返发送,涉及到了一系列h

2021-03-10 12:48:20 366

原创 重排和重绘

重绘重绘是指一个元素外观的改变所触发的浏览器行为,浏览器会根据元素的新属性重新绘制,使元素呈现新的外观。重排也叫重构/回流/reflow,当渲染树中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建, 这就称为回流(reflow)。每个页面至少需要一次回流,就是在页面第一次加载的时候。重排和重绘的关系当DOM的变化引发了元素几何属性的变化,比如改变元素的宽高,元素的位置,导致浏览器不得不重新计算元素的几何属性,并重新构建渲染树,这个过程称为“重排”。完成重排后,要将重新构建的渲染

2021-03-09 21:27:03 122

原创 面试题:画一条0.5px的线

思路:将盒子的高度定为1px,再利用css3中的2D变换变为0.5pxdiv{ width: 1000px; height: 1px; background-color: rgb(10, 10, 10); transform: scale(1,0.5); //或者 // transform:scaleY(0.5);}

2021-03-09 18:59:25 538

原创 数组乱序

数组乱序是将一个数组如:[1,4,2,5,6,3]打乱顺序,如[4,1,5,3,6,2]方法一:利用sort()var values = [1, 2, 3, 4, 5];values.sort(function(a,b){ return Math.random() - 0.5;});console.log(value);方法二从原数组(假如长度为n)中,随机生成一个索引 random从原数组中删除第 random 个元素并将其push到新数组重复第2步直到所有元素取完最终得到一

2021-03-09 17:03:01 1198

原创 cookie session token

为什么会发明cookie session token?因为http协议是无状态的,每次客户端访问服务器端,服务器都不知道是谁来访问了它。这在过去也不需要知道是谁,用户向服务器请求想看的页面,服务器响应返回。但是现在交互式网页的产生,使得服务器需要知道是哪个用户访问了,比如购物网站。这时就必须搞清楚谁是谁的问题了。Cookie(1)什么是cookie?Cookie是服务器用来辨认客户端身份的文本信息。由于HTTP是无状态的,也就是服务端并不知道发来请求的客户端是谁。但在某些时候需要知道客户端身份,这时

2021-03-09 14:58:35 68

转载 浏览器的工作原理

参考https://segmentfault.com/a/1190000017019877这篇好文进行整理浏览器的组成用户界面:除了浏览器主窗口显示用户请求的页面外,其他显示的各个部分都属于用户界面。用户界面后台:用于绘制基本的窗口小部件。浏览器引擎:在用户界面和渲染引擎之间传递指令。渲染引擎:负责显示请求的内容。网络:用于网络调用。JavaScript解释器:用于解析和执行 JavaScript 代码,比如chrome的javascript解释器是V8。数据存储:浏览器需要在硬盘上保存各种

2021-03-09 10:43:12 59

原创 防抖和节流

为什么要防抖和节流?防止高频次的事件触发造成回调函数来不及执行(也就是回调函数的执行跟不上频繁的事件触发)。例如当实现一个函数:当鼠标经过div时就会输出对应的坐标。这仅仅是输出坐标可能还能跟得上,但是我们可以把此回调函数想成复杂函数,来想下防抖和节流…防抖可能更想要的功能是当鼠标停留在某个地方时才会输出坐标。那么怎么知道鼠标停下了呢?可以认为当过一段时间(比如10ms)仍然没有触发事件(鼠标没有移动)就可以认为在停留了。一段时间需要依赖setTimeout这个函数:setTimeout(fn,10

2021-03-08 20:02:06 43

原创 new运算符

new运算符的执行原理new操作符实现原理: function news(func) { var target = {};//生成新对象 target.__proto__ = func.prototype;//实例的__proto__指向原型,构造函数的prototype也指向原型(链接到原型) var res = func.call(target);//把函数的this绑定在了新生成的对象中 if (ty

2021-03-08 17:18:44 289

原创 对象的深拷贝与浅拷贝

1. 浅拷贝(1)什么是浅拷贝浅拷贝是将对象复制了一份,如果原对象中的引用类型改变,则浅拷贝出来的引用类型也改变。因为浅拷贝只是拷贝了引用类型的指针(保存在栈内存),而没有拷贝其实质值。(2)实现简单实现var obj={ name:'lxt', family:{ father:'lzj', mother:'wyl' }, colorlike:['red','black']}function shallowCopy(temp)

2021-03-08 16:41:37 237

原创 闭包

不再进行整理《JavaScript》的第310页说的非常清楚了!

2021-03-08 14:04:52 57

转载 instanceof 原理以及与typeof的区别

一. typeof1.typeof的作用:用来判断数据类型。可以用来判断string,number,boolean,function,object,symbol,undefined这些数据类型。但是并不能判断到底是什么类型的Object。例如:var a=[1,2,3];console.log(typeof a);//object2.typeof的原理:js 在底层存储变量的时候,会在变量的机器码的低位1-3位存储其类型信息:对象:000 浮点数:010 字符串:100 布尔:110

2021-03-08 13:26:40 378

原创 数组扁平化

数组扁平化就是将一个多维数组转化为一维度数组,如:[1,2,[[3,4],5,[6,7]]]——>[1,2,3,4,5,6,7]把这个问题可以看作一个算法题…第一时间想到遍历数组,如果遍历到的这一元素是数组就递归遍历这个元素,如果不是则将该元素添加到结果数组。方法一 :递归var arr=[1,2,[[3,4],5,[6,7]]];var res=[];function test(arr){ for(let i=0;i<arr.length;i++){ if(Array

2021-03-08 11:41:47 146

原创 箭头函数

ES6新增了箭头函数,任何可以使用函数表达式的地方都可以使用箭头函数格式var test1 = function (a, b) { return a + b;}//等价于var test2 = (a, b) => { return a + b };//调用test1(1, 2);test2(2, 3);省略小括号如果只有一个参数时,可以省略括号。var test3 = a => { return a };省略大括号如果省略大括号,那么箭头后面只能包含一行代码

2021-03-08 10:09:16 75

原创 JavaScript的执行上下文和作用域链

我觉得作用域和执行上下文是两个不可分开的概念。在ES6之前,JavaScript不同于C/C++这些语言,其作用域只有全局作用域和函数作用域。执行上下文变量或函数的上下文决定了他们可以访问哪些数据。下面根据一段代码来解释:var a=10;function test1(){ let b=20; function test2(){ let c=b; b=a; a=c; } test2()}test1();

2021-03-07 21:55:20 55

原创 Javacript中的变量提升

我认为在搞清楚变量提升这个问题之前先弄清楚JS引擎执行和域这两个东西JS引擎执行分为两个阶段:预处理阶段(编译),执行阶段(1)预处理阶段一共完成四件事情:(以 var a=10;进行解释)词法分析:将var a=10;分解为var/a/=/10/;五个代码块语法分析:将词法单元流(数组)转化成抽象语法树AST(Abstract Syntax Tree)生成可执行代码:相当于是再把AST转换成浏览器可执行的代码,或者是各种语言引擎可执行的代码。在编译阶段,会创建变量对象(VO),变量对象

2021-03-07 21:02:31 218

原创 原型和原型链

之前看《JavaScript高级设计程序》对原型和原型链有了一定的了解,也觉得自己掌握了,但是今天回顾起来,发现很多都忘记了…今天就来总结下吧原型任何函数都有显式原型prototype任何引用(对象/数组/函数)都有隐式原型proto实例对象的隐式原型和其构造函数的显示原型相同 function Person(name) { this.name = name; } Object.prototype.zhiye = 'student'; var l

2021-03-07 19:07:56 51

原创 for...in和for...of的区别

今天终于弄懂了!1. for…in(1)for…in只能遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性(2)for…in循环,只能获得对象的键名,不能直接获取键值(3)遍历顺序有可能不是按照实际数组的内部顺序(4)for in更适合遍历对象 Object.prototype.shuxing='person'; var obj={ name:'lxt', sex:'nv', age:18 } for(

2021-03-07 16:38:20 203

原创 用css画三角形

一步一步来1.画一个宽高为80px,边框宽度为30px的正方形 div{ width: 80px; height: 80px; border: 30px solid; border-color: rgb(214, 102, 120) rgb(55, 15, 167) rgb(19, 18, 18) rgb(141, 212, 27) ; }没想到是这样的…2.继续…将宽高设为0px div{ width: 0px;

2021-03-07 15:19:33 107

原创 跨域理解

在了解跨域这个概念之前,先了解下浏览器的同源策略吧!什么是同源策略?1.同源策略是浏览器设置的一种安全策略,限制了从同一个源加载的文档或脚本与来自另一个源的资源进行交互2.什么是同源呢?答:同源是两个URL具有相同的协议/端口号/域名3.如果没有同源策略会怎么样呢?最主要就是安全问题没有同源策略就意味着一个网页可以随意访问另一个网页。会造成CSRF攻击和钓鱼网站可以直接拿到别的网站的Dom。用户访问www.mybank.com ,登陆并进行网银操作,这时cookie啥的都生成并存放在浏览

2021-03-06 16:31:52 117

原创 剑指 Offer 12. 矩阵中的路径

剑指 Offer 12. 矩阵中的路径考察回溯法回溯其实就是纯暴力枚举,把所有情况列举下,如果列举到一半发现已经不符合要求了及时剪枝,并且把之前做出的选择撤销,比如本题如果列举的一条路径不符合要求,把之前访问过的位置全部改回原来的值。也就是先试着走着,不对就撤回去,再重走(枚举的搜索尝试过程)。第一步:先在二维数组中找到字符串的第一个字符第二步:找到后将该位置置为’-’,防止重复访问第三步:向该位置的周围遍历,看哪个符合下个字符的内容第四步:若符合继续找下去,否则还原置为’-'的元素,返回去重

2021-03-05 12:50:54 50

原创 剑指 Offer 11. 旋转数组的最小数字

题目:最开始解法:对于[3,4,5,1,2],我的想法是找到一个边界,当一个元素比它前一个元素小的时候。那么这个数就是最小值。但是如果这个数组是[1,2,3,4,5]呢?即没有进行旋转,此时上面的做法就不成立了,需要比较第一个和最后一个元素,如果小于等于最后一个元素的话,就说明最小的是第一个元素。这样的复杂度是O(n)。其实后面想了下,最后不用经过判断再返回第一个元素了,可以直接返回numbers[0]看了官网之后的解答:因为旋转数组是由两个有序数组组合而成,因此适合用二分法来查找1.一个

2021-03-05 11:08:37 157 1

原创 Ajax(三):XMLHttpRequest对象

Ajax(三):XMLHttpRequest对象参考:https://blog.csdn.net/weixin_37580235/article/details/81459282一.实例化一个XMLHttpRequest对象(XMLHttpRequest 其实是一个构造函数)var xmlReq=new XMLHttpRequest();如果是IE5或者IE6浏览器:var xmlReq=new ActiveXObject("Microsoft.XMLHTTP");所以总的代码为:var

2021-03-04 22:16:56 184 1

原创 Ajax(二):技术实现

Ajax(二):技术实现一.若没有Ajax时,一般的表单提交代码为:客户端代码<form id="form1" action="Test.ashx" method="get"> 您的姓名1:<input type="text" name="fname" size="20" /> <input type="submit" name="submit" value="Sumbit"></form>服务端代码public void Proce

2021-03-04 21:01:18 214 1

原创 Ajax(一):工作原理

什么是Ajax?1.Ajax是 Asynchronoous JavaScript and XML(异步JavaScript 和 XML)的缩写。2.Ajax是一种创建交互式、快速动态网页应用的网页开发技术。3.一种无需重新加载整个网页的情况下,就能够更新部分网页的技术。为什么使用Ajax?1.由于JavaScript是单线程,这就使得JS引擎只能完成一个任务才能接着完成下面的任务,如果当前任务的执行时间较长,就会发生阻塞(后面的任务无法继续执行,只能卡在此处)。试想一下,如果用户正要加载一个信息(

2021-03-04 20:16:30 294 7

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除