- 博客(20)
- 收藏
- 关注
原创 从无到有搭建前端项目
1.github创建项目,clone到本地git clone "xxxxxxxx"cd my_project2.npm 初始化项目(入口文件写 src/index.js)npm init 3.创建几个文件夹mkdir src build test doc example4.新建 src/index.js 文件alert('hello world')5.安装webpack和babel插件npm i babel-core babel-loader babel-polyfill ba
2022-01-12 17:59:22
299
转载 五子棋小游戏
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>五子棋</title> <style type='text/css'> canvas { display: block; margin: 50px auto;
2021-08-04 14:51:11
89
原创 用 xlsx 导出 excel
安装xlsxnpm i / yarn add xlsxdemo:export = () => { const data = [{...}, ...]; const header1 = ['基础信息', null', null, '高级信息', null, null]; // 两层头部(第一层) const header2 = ['姓名', '年龄', '地址', '高级信息1', '高级信息2', '高级信息3']; // 两层头部(第二层) const bod
2021-05-19 18:05:30
1012
原创 浏览器页面渲染实现
【目标:页面内容快速加载 + 交互流畅】1.导航:用户通过在地址栏输入一个URL、点击一个链接、提交表单或者是其他的行为2.DNS查找:对于一个web页面来说导航的第一步是要去寻找页面资源的位置。如果导航到https://example.com, HTML页面 被定为到IP地址为 93.184.216.34 的服务器。如果以前没有访问过这个网站,就需要进行DNS查找。3.‘三次握手’建立连接 (tsl建立安全连接)4.响应:浏览器向服务器发送http请求,服务器响应返回数据。5.解析:解析
2021-05-18 18:12:31
138
转载 长(列表/页面)渲染
https://bvaughn.github.io/react-virtualized/#/components/Collection
2021-05-17 10:51:49
116
原创 react-router 和 @reach/router
react-router1、基本用法 npm install -S react-router // 安装Router组件本身只是一个容器,真正的路由要通过Route组件定义。import { Router, Route, hashHistory } from 'react-router';render(( <Router history={hashHistory}> <Route path="/app" component={App}/> //访问根路由'
2021-05-14 16:34:23
1184
原创 ES不同版本语法新特性
es61.类(class)对熟悉Java,object-c,c#等纯面向对象语言的开发者来说,都会对class有一种特殊的情怀。ES6 引入了class(类),让JavaScript的面向对象编程变得更加简单和易于理解。2.模块化(Module)ES5不支持原生的模块化,在ES6中模块作为重要的组成部分被添加进来。模块的功能主要由 export 和 import 组成。每一个模块都有自己单独的作用域,模块之间的相互调用关系是通过 export 来规定模块对外暴露的接口,通过import来引用其它模块
2021-05-14 15:53:24
580
原创 二分查找
1.首先,从有序数组的中间的元素开始搜索,如果该元素正好是目标元素(即要查找的元素),则搜索过程结束,否则进行下一步。2.如果目标元素大于或者小于中间元素,则在数组大于或小于中间元素的那一半区域查找,然后重复第一步的操作。3.如果某一步数组为空,则表示找不到目标元素。binarySearch = (arr, val) => { let min = 0; let max = arr.length - 1; while (min < max) { const
2021-05-14 15:20:54
87
原创 快速排序
快速排序:1.从数组中选择一个元素作为基准点。2.排序数组,所有比基准值小的元素摆放在左边,而大于基准值的摆放在右边。每次分割结束以后基准值会插入到中间去。3.最后利用递归,将摆放在左边的数组和右边的数组在进行一次上述的1和2操作。function quickSort(arr) { if (arr.length <= 1) { return arr } const left = []; const right = []; const mid
2021-05-14 15:02:32
66
原创 冒泡排序
原理:1.比较相邻的元素。如果第一个比第二个大,就交换他们两个。2.对每一对相邻元素做同样的工作,从开始第一对到结尾的最后一对。3.针对所有的元素重复以上的步骤,除了最后一个。直到没有任何一对数字需要比比较。(有m个数,你需要比较m-1次,这个是固定的。但是每一次比较的次数,是递减的)代码:function sort(arr) { if (Array.isArray(arr) && arr.length > 0) { // 判断是否是长度大于0的数组 fo
2021-05-14 14:54:40
74
原创 Elasticsearch搜索方法总结
*/**倒排索引 -> 按照分词匹配。(分词 找 文档)**写入数据时会对字段进行分词(按照配置的分词器)存储。**match:分词匹配(走分词器,对query分词,然后按照分词后的结果查询)。**term:精确查找 (不对query分词-> 会把query作为一个整体(类似于keyword类型))。**match_phrase: match查询 + 顺序。*wildcard: 模糊匹配。/1.空搜索 GET /_search返回结果中最重要的部分是 hits ,它包含 tot
2021-05-14 11:31:12
1738
原创 前端 【防抖和节流】
1.防抖:对于短时间内连续触发的事件,防抖就是让某个事件期限内,事件处理函数只执行一次。(比如要实现在输入框中边输入边根据输入内容返回搜索的结果,如果不做防抖处理,输入一个文字就会触发很多次请求,这样会浪费很大的资源,并不是我们需要的结果,这时用防抖就可以完美的解决了)const debounce = (fn, delay) => { return () => { if (this.timeout) { clearTimeout(this.timeout)
2021-05-14 11:15:05
246
原创 找出给定时间段范围内的所有月份
(网上找了好几个,发现都是复制抄袭的,还没什么用,自己写了个)话不多说,直接附代码:function getMonthAll(startTime, endTime) { // startTime 和 endTime 格式为任意格式 const len = (Number(endTime) - Number(startTime)) / (24 * 60 * 60 * 1000) cons......
2019-09-25 15:54:00
385
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人