- 博客(618)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 开发常用网站
图床 - 引用ur图片api - 调用接口和生产借口文档说明MDN - 学习前端chrome插件Octotree - github展示树Allow-Control-Allow-Origin - 跨域
2019-07-15 19:00:38
1272
原创 桶排序算法
// 桶排序const bucketSort = (array, bucketSize) => { if (array.length === 0) { return array; } console.time('桶排序耗时'); let i = 0; let minValue = array[0]; let maxValue = array[0]; for (i = 1; i < array.length; i++...
2021-12-05 20:58:02
433
原创 less和sass学习
lessmixi将一系列的属性从一个规则集引入到另一个规则集的方式。普通混合 - center会编译到css中.center{ position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto; background: @color; height: 100px; width: 100px;}.inner1 { .ce
2020-06-23 00:15:50
642
原创 vuex学习
vuex父向子传值: v-bind属性绑定子向父传值: v-on属性绑定兄弟组件之间数据共享： EventBus$on 接受数据的那个组件$emit 发生数据的那种组件vuex是实现组件数据共享的机制，组件之间的数据共享。便于维护和开发组件之间数据共享响应式，能够保持数据与页面的同步访问state数据1 $store.state.count2 使用mapState1. 导入mapState2. 将导入的mapState，映射到当前组件的computed计算属
2020-06-23 00:14:10
486
原创 vue基础学习
Vue.js - day01插件安装推荐vscode有二个常用插件：vetur，Vue 2 Snippetsvetur:让一些vue的关键字能高亮显示，还能进行一些语法的检测。语法错误检查，包括 CSS/SCSS/LESS/Javascript/TypeScript等语法高亮，包括 html/css/sass/scss/less/js/ts等Vue 2 Snippets：能在平时写代码过程中提示功能更强大,对vue的语法有提示官网地址(里面列出了相关提示快捷词)： https://
2020-05-31 22:14:01
677
原创 爬虫代码
from selenium import webdriverimport requestsfrom selenium.webdriver.chrome.options import Optionsimport timeheaders ={ "User-Agent": "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (K...
2020-01-16 19:50:45
1392
1
原创 html2canvas中如何打印svg
普通的svg打印<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <title>xy2</title> <script src="https://cdn.staticfile.org/jquery/1.10.2/jque...
2019-12-20 13:41:19
1996
原创 ubuntu搭建gitlab服务器
效果图如何搭建安装ubuntu安装gitlab配置邮箱配置邮箱// /opt/gitlab-8.5.1-0/apps/gitlab/htdocs/config/environments config.action_mailer.smtp_settings = { :addres => "smtp.163.com", :po...
2019-12-04 17:38:52
375
原创 service worker详解
什么是渐进式应用程序增加用户体验即使在不确定的网络条件下，也可立即加载且永不显示downasaur(chrome联网不存在的页面)。使用柔滑流畅的动画快速响应用户交互，并且不会出现混乱的滚动。感觉像设备上的自然应用程序一样，具有身临其境的用户体验PWA为什么会出现service worker随着 Web 业务不断复杂，我们逐渐在 js 中加了很多耗资源、耗时间的复杂运算过程，这...
2019-11-14 14:44:07
1165
原创 js实现全屏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2019-10-22 23:52:13
409
原创 http缓存
http缓存把服务器缓存的数据,存放到本地.在发送请求的时候,会看是否会命中强缓存,若是的话,会从强缓存中获取资源,若不是的话,会从协商缓存中找资源,若协商缓存没有命令,则会去服务器获取资源.chrome 资源强缓存先从本地找资源 --> 命中强缓存,返回200,直接使用强缓存,并且不会发送请求到服务器强缓存是利用Expires或者Cache-Control，若时间未过期，...
2019-10-22 23:47:25
228
原创 Event类的简单实现
写一个Event类，实现事件的绑定（on方法），调用（trigger方法），解绑（off方法），on可以多次绑定事件，每个事件都可以被单独触发，被单独解绑，请手写代码。class Event { constructor(){ this.obj = {} } on(name, callback) { if(!this.obj[name])...
2019-10-14 22:59:27
779
原创 什么是CDN
CDNContent Delivery Network，即内容分发网络。解决internet网络拥挤的状况,提高用户访问网站的响应速度.不同的区域,使用不同的cdn资源好处提高用户的访问速度减轻服务器压力提升网站的稳定性和安全性DNS域名解析系统智能dns域名解析 - 可以智能的判断访问您网站的用户，然后根据不同的访问者把您的域名分别解析成不同的IP地址。如访问者是网...
2019-10-01 19:48:25
530
原创 正向预查和负向预查
正向预查(只起到判断左右)零宽度断言 - 只起到判断左右正向预查(零宽度断言) - 代表从左到右进行匹配// keyword(?:pattern) - 只匹配满足条件的keyword和patternconsole.log( "windows 10".match(/windows\s(?:10)/));// keyword(?=pattern) - 只匹配满足pattern条件的ke...
2019-09-01 22:56:53
2691
原创 Field组件的工作流程
Field介绍对表单数据操作、校验.对组件关联后可以自动对表单数据进行回写、读取、校验。把需要验证表单数据交给Field去处理工作流程图通过事件的方式,来让Field与组件之间的数据进行流动.(就好比数据的回显)方法的分析请先导读官网的Field,讲的很明白了,不懂的可以问题.预备知识forceUpdate - React的方法, 当props和state不改变时,可...
2019-08-18 22:39:19
625
原创 node学习
content1. node的介绍2. 模块机制2.1 commonjs规范2.1.1 commenjs的模块规范2.2 node的模块实现2.2.1 路径分析2.2.2 文件定位2.2.3 模块编译核心模块1. node的介绍js缺陷没有模块系统标准库少（文件系统，ｉ/o等操作没有常见ａｐｉ）没有标准接口缺乏包管理工具node特点异步I/O - 绝大多数的操作都以异步的...
2019-08-14 20:02:07
679
原创 JavaScript中自定义实现Array方法
JavaScript中自定义实现Array方法isArray判断是否为数组提供一下方法function isArray(arr) { // 方法１ return arr.constructor == Array; // 方法2 // https://github.com/nianxiongdi/fore-end/issues/4 //...
2019-08-11 00:02:00
1086
原创 自定义实现JavaScript的String方法
自定义实现JavaScript的String方法length方法function String(str) { this.str = str; this.length = 0; var i=0; while(str[i]) { i++; } this.length = i;}var str = new String('ab...
2019-08-10 16:53:12
522
原创 清除浮动
浮动产生的副作用 背景不能显示 边框不能撑开 margin padding设置值不能正确显示 清除浮动 1. 父级设置高度 2. 增加子元素，设置clear:both 3. 父级div设置overflow: hidden代码 清除浮动...
2019-08-08 19:48:43
186
原创 Fusion Design之Form组件源码分析1
From介绍请大家先导读Form组件使用和Field组件使用首先先明白一点,这是为了解决什么问题?简化表单的操作,优美的布局,提供方法的api如何进行数据存储的通过Filed组件,统一对数据进行管理,可以自己传,也可以不用传,内部已经定义好了.在进行数据管理的时候,通过onChange方法与Filed数据管理之间进行数据传递Form组件的apiinline - 内联...
2019-08-07 21:29:57
746
原创 完全DOM写表单
自己对dom的理解不够深刻,就练习联系,是根据Fusion Design的例子,去编写一个;分析代码结构看例子去看看dom结构是什么,然后再利用dom方法去创建遇到的问题表单元素如何创建 - 封装成一个方法进行统一的创建已有的表单元素如何转换为dom结构 - 分析dom结构的创建方法form提交刷新问题 - form.setAttribute('onsubmit',"return ...
2019-08-07 11:32:12
217
原创 typeof与instanceof
JavaScript数据类型是非常简洁的，它只定义了6中基本数据类型null：空、无。表示不存在，当为对象的属性赋值为null，表示删除该属性 undefined：未定义。当声明变量却没有赋值时会显示该值。可以为变量赋值为undefined number：数值。最原始的数据类型，表达式计算的载体 string：字符串。最抽象的数据类型，信息传播的载体 boolean：布尔值。最机械的数...
2019-06-29 10:59:01
193
原创 函数式编程-Lodash库学习
介绍Lodash 通过降低 array、number、objects、string 等等的使用难度从而让 JavaScript 变得更简单。Lodash 的模块化方法 非常适用于：遍历 array、object 和 string对值进行操作和检测创建符合功能的函数使用chunk - 对数组的切分,size代表以几个元素进行切分，默认为1语法_.chunk(array, size...
2019-06-26 20:53:46
803
原创 基于Fusion Design和eggjs搭建个人博客-附完整源代码
1. 介绍1.1 Fusion DesignAlibaba Fusion Design System 是一套旨在全面提升设计、开发效率的工作方式。通过协助企业构建设计系统，提供系统化工具协助设计师、前端使用设计系统，提供一站式设计项目协助平台，打通互联网产品从设计到开发的工作流。1.2 eggjs基于koa开发的nodejs后端框架,特性如下:提供基于 Egg 定制上层框架的能力高度...
2019-06-07 12:32:33
2353
原创 react-router添加路由刷新页面后显示404
原因: 是因为刷新之后history中的数据没有保存,需要在devServer中设置historyApiFallback: true.
2019-06-01 14:55:22
2075
3
转载 js中v8引擎的详解－看的吐血
v8引擎出现的原因这里先说一下什么是编译型语言和解释性语言：编译型语言： 在程序执行之前必须进行专门的编译过程，有如下特点：只须编译一次就可以把源代码编译成机器语言，后面的执行无须重新编译，直接使用之前的编译结果就可以；因此其执行的效率比较高；编译性语言代表：C、C++、Java、Pascal/Object Pascal（Delphi）；程序执行效率比较高，但比较依赖编译器，因此跨平台...
2019-05-25 23:16:19
50292
17
原创 Fusion之Input组件源码分析
将依照fusion官网,https://fusion.design/component/basic/input分析input组件,如下:分析源码:Base.jsx //封装一下方法和属性Input.jsx //渲染inputGroup.jsx //对input进一步的封装看官网的api,一步一步的实现所有的方法和属性Input组件:value属性当前值 String/Numb...
2019-05-13 21:38:52
514
转载 TypeScript学习
概念TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持，它由 Microsoft 开发，代码开源于 GitHub 上。使用我们约定使用 TypeScript 编写的文件以 .ts 为后缀，用 TypeScript 编写 React 时，以 .tsx 为后缀。tsc file.ts 转换为js文件遇到问题变量变红色 － https...
2019-05-11 15:18:27
256
原创 关于自定义组件时，数据的传递和事件的调用机制
<!DOCTYPE html><html><head><meta charset="UTF-8" /><title>render</title><script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js">&...
2019-04-09 17:27:20
365
转载 js中arguments参数
描述arguments对象是所有（非箭头）函数中都可用的局部变量。你可以使用arguments对象在函数中引用函数的参数。此对象包含传递给函数的每个参数，第一个参数在索引0处。例如，如果一个函数传递了三个参数，你可以以如下方式引用他们：arguments[0]arguments[1]arguments[2]参数也可以被设置：arguments[1] = ‘new value’; /...
2019-04-07 21:40:23
1301
转载 神奇的Object.defineProperty
这个方法了不起啊。。vue.js和avalon.js 都是通过它实现双向绑定的。。而且Object.observe也被草案发起人撤回了。。所以defineProperty更有必要了解一下了几行代码看他怎么用。第一次写文章，文章是别人的，练练手。 var a= {} Object.defineProperty(a,"b",{ value:123 })console.l...
2019-04-06 14:54:16
239
转载 React.createContext官网的解读
解决什么问题Context 通过组件树提供了一个传递数据的方法，从而避免了在每一个层级手动的传递 props 属性。何时使用 ContextContext 设计目的是为共享那些被认为对于一个组件树而言是“全局”的数据，例如当前认证的用户、主题或首选语言。例如，在下面的代码中，我们通过一个“theme”属性手动调整一个按钮组件的样式：function ThemedButton(props...
2019-04-05 18:03:43
24671
2
原创 js中函数为参数的处理-思想
//思想 当函数为参数时let status = 0;function setStatus(flag) { status = flag;}//这种方式去处理function handle(setStatus){ setStatus(1);}//调用handle(setStatus)console.log(status);...
2019-04-05 12:08:20
571
转载 箭头函数
一、基本语法ES6中允许使用箭头=>来定义箭头函数，具体语法，我们来看一个简单的例子：// 箭头函数 let fun = (name) => { // 函数体 return `Hello ${name} !`; }; // 等同于 let fun = function (name) { // 函数体 return `Hello ${name} !`...
2019-04-03 19:43:52
4821
转载 关于正则表达式中replace的第二个参数
语法string.replace(searchvalue,newvalue)参数值searchvalue必须。规定子字符串或要替换的模式的 RegExp 对象。请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。newvalue必需。一个字符串值。规定了替换文本或生成替换文本的函数。返回值String一个...
2019-03-30 19:08:29
2204
原创 在js中date日期为Invalid Date
console.log(new Date(param))原因: 发现 param参数为10位的时间戳,js需要的是13位的解决:console.log(new Date(param*1000))
2019-03-30 17:33:13
14946
原创 css小例子
1. 新闻代码:<!DOCTYPE html ><html lang="en"><head> <meta charset="UTF-8"> <title>overflow</title> <style type="text/css"> *{ margin:...
2019-03-30 14:33:16
216
原创 css属性的学习
outline-style属性用于设置元素的整个轮廓的样式。样式不能是 none，否则轮廓不会出现。 .username { outline-style: none; } <label for="username">用户名:</label><input id="username" class="username"/>...
2019-03-30 13:54:43
195
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人