- 博客(17)
- 收藏
- 关注
RSS订阅原创 React Hooks 实现虚拟列表无限滚动与自适应输入框
利用 IntersectionObserver 实现虚拟列表无限滚动设计背景： 用于实现长列表的无限滚动 DOM 渲染的性能，使用虚拟列表，在滚动过程中只展示特定的视野左右的列表项。一. 核心技术：原生的交叉观察者（IntersectionObserver）利用交叉观察者可以监听元素在滚动过程中和祖先元素的相交情况，利用这个API可以避免对滚动的监听和频繁的计算。创建一个 Observer 实例，分别观察列表头尾元素，传入相应的配置，这里头部有个 fixed 定位的 header 所以设置祖
2020-07-24 17:11:40
1747
原创 【JavaScript基础】深入了解JS的闭包
闭包是JS中一个重要的概念，也是面试中的重点，相信大家在面试中都会碰到这样的几个问题： 1. 请你说说什么是闭包？ 2. 请你说说闭包有哪些应用？ 3. 请你说说闭包有哪些优缺点？ 大家都是怎么回答这几个问题的呢？在网上的文章中对闭包的概念都有不同的说法，导致很多人对闭包没有一个清晰的概念，接下来就和我一起探究什么是闭包。 首先...
2020-04-16 22:40:44
251
原创 虾皮前端岗面经
整理的有点晚，有些可能没记清楚（本来懒得写的，发现shopee真的很抢手，不下十个人和我要面经，这就是 kpi 产物吧）一面（大概3-40分钟）js事件机制，如何阻止事件冒泡，事件委托原理 跨域方案 闭包原理应用 列举http 状态码/请求头（这里聊了挺多，基本上把我知道的都挖出来了，捂脸.jpg） cookie 的一些字段属性 cookie，session的区别...
2020-03-13 00:24:19
8011
2
原创 小程序底层框架原理
开发模式由于小程序宿主是客户端的App，如果采用纯客户端的原生技术来编写，那小程序的代码需要和App代码一起发布，这种开发节奏不符合小程序的需求所以要像 web 技术一样存放一份随时可以更新的资源包放在云端，下载到本地动态执行后即可渲染出页面。选择Hybrid的渲染方式。双线程模型可以阻止开发者使用一些浏览器提供的跳转页面，操作 DOM ，动态执行脚本等开放性接口。渲染层： 多个 Web...
2019-07-08 21:28:07
1261
原创 字节跳动前端实习一面二面HR面面经
16号做完笔试，后来约了21号一面，25号二面，一面面试官看起来比较和蔼，一来就是自我介绍，他说前端的问题我也没准备多少，我就知道他不是前端的了，瞬间有点方。一面一开始是数据结构的题，二叉树相关，已知前序遍历和中序遍历的结果，求树的结构，这个讲了一下思路面试官就给过了。http请求方法有哪些？跨域问题遇过吗？什么办法可以解决？讲了一下cors，jsonp，websocket，postme...
2019-03-29 22:37:39
6365
原创 实现 es6 Promise 原理
const PENDING='pending'const RESOLVED='resolve'const REJECTED='rejected'function myPromise(fn){ var that=this this.value='' this.resolveCal...
2019-03-19 16:31:37
388
原创 LeetCode二叉树相关部分题目——js解法
写好递归函数，二叉树的简单问题就基本解决了，以下整理了二叉树的一些简单题目，难度递增。数据结构：function TreeNode(val) { this.val = val; this.left = this.right = null;}1.相同的树题目描述：给定两个二叉树，编写一个函数来检验它们是否相同。如果两个树在结构上相同，并且节点具有相同的值，则认...
2019-03-07 19:15:35
505
原创 js算法题/前端面经总结（一）
1.实现链表的反转(function (){ var node3 = { name:'obj3', next:null } var node2 = { name:'obj2', next:obj3 }...
2019-03-03 15:26:16
413
原创 JavaScript里的深浅拷贝原理及方法
深浅拷贝是在复制复杂类型的值引用时的概念，我们在对象和数组中讨论它的深浅拷贝浅拷贝概念：浅拷贝既只拷贝对象的基本类型的值，并不复制引用类型的值而是引用它的指针，看以下的例子：可以看到当a改变时b也不得不跟着改变，这就是“拿人手短”，因为它只是引用了原来对象的指针，取了它的基本类型的值。深拷贝概念：深拷贝可以拥有一个对象的所有属性和方法，实现真正的“独立自主”，不引用原来对象的指针，开辟...
2019-01-14 15:27:09
810
原创 前端性能优化总结（二）
CSS选择符在大多数人的观念中，都觉得浏览器对 CSS选择符的解析式从左往右进行的，例如#toc A { color: #444; }这样一个选择符，如果是从左往右解析则效率会很高，因为第一个 ID选择基本上就把查找的范围限定了，但实际上浏览器对选择符的解析是从右往左进行的。如上面的选择符，浏览器必须遍历查找每一个 A标签的祖先节点，效率并不像之前想象的那样高，所以在写选择符的时候需要注意很多事...
2019-01-12 19:21:05
233
原创 前端性能优化总结（一）
一.减少http请求消耗资源1.Css Spritescss sprites是将多幅图融合到一张图片里，这样可以减少图片的请求数量，再通过css技术把想要的图片样式展示在浏览器页面上，虽然合成的图片会比较大，但这样做确实可以减少请求资源的消耗。2.Inline Image使用 data: URL scheme的方式将图片嵌入到页面或 CSS中，scheme有：data:image/...
2019-01-12 18:26:37
243
原创 JS数组去重的几种实现方法
//使用indexOf function unique1(arr) { var result=[]; for(var i=0;i<arr.length;i++){ if(result.indexOf(arr[i])==-1){ result.push(arr[i]); } } return result; } //利用对象属性不能重...
2019-01-12 13:18:30
178
原创 js杨辉三角控制台输出两种解法
1 1 1 1 2 1 1 3 3 1 1 4 6 4 11 5 10 10 5 1........观察这样的一组数，找出规律，用控制台输出这样规律的数规律：这是杨辉三角，每一行头尾的数都是1，其余的数是上一行对应的数字相加。一.使用递归算法。js代码如下： function combination(m,n...
2019-01-12 13:12:15
639
原创 关于JS的事件机制、EventLoop、线程模型
事件机制分为：事件捕获阶段、目标阶段和冒泡阶段。冒泡是指一个事件的目标由里层向外层冒泡，以点击事件onclick举例，用事件绑定onclick的写法会出现事件冒泡，可以用事件监听的写法Object.addEventListener('click',(e)=>{...},boolean),第三个参数是布尔值，true为事件捕获，false为事件冒泡，IE浏览器的兼容写法是Object.at...
2018-12-31 16:00:13
237
原创 微信小程序利用animation实现元素翻转到背面
效果如图，正反面分别写两个元素，布局让两个元素重叠wxml的代码：<view class='rotateCtn'> <!--正面的框 --> <view class='{{frameClass1}}' data-id='1' bindtap='rotateFn' style='background-color:yellow'> ...
2018-08-03 22:32:18
3842
4
原创 微信小程序实现历史搜索记录的本地储存和删除
输入框和搜索按钮表单的wxml，没啥特别的，这里绑定了输入框的输入值，样式我就不放上来了 <form class='searchForm' bindsubmit='searchSubmitFn'> <input value="{{searchValue}}" class='topInput' name='input'/> <butt...
2018-07-19 16:06:38
20654
4
原创 Google浏览器上安装 Vue Devtools
第一步：到github上下载devtool压缩包，地址： https://github.com/vuejs/vue-devtools 解压后我们得到vue-devtools-master文件夹，在文件夹里打开cmd命令行，依次输入npm install 命令与npm run build 命令，速度较慢，为了加快速度，我们安装一下淘宝镜像（PS：淘宝把外网的东西下载好了，放在它的服务器上，使我们能
2018-04-14 21:31:10
640
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人