- 博客(51)
- 收藏
- 关注
RSS订阅转载 React组件传值方式总结
1. 子组件向父组件传值父组件Header:import Nav from 'Nav.js';class Header extends React.Component { constructor(props) { super(props); this.state = { } this.callbackForNav = this.callback...
2018-09-13 18:16:00
155
转载 React组件性能优化总结
性能优化的思路影响网页性能最大的因素是浏览器的重排(repaint)和重绘(reflow)。React的Virtual DOM就是尽可能地减少浏览器的重排和重绘。从React渲染过程来看，如何防止不必要的渲染是解决问题的关键。性能优化的具体办法1. 尽量多使用无状态函数构建组件无状态组件只有props和context两个参数。它不存在state，没有生命周期方法，组件本身即有...
2018-09-13 18:15:00
211
转载 npm包的发布
假设该待发布包在你本地的项目为 project1包的本地安装测试在发布之前往往希望在本地进行安装测试。那么需要一个其他的项目来本地安装待发布项目。假设该其他项目为project2。假设project2和project1在同一级目录下。1. 创建指向待测试包的符号链接包cd project1npm link2. 本地安装cd project2npm install '.....
2018-09-06 10:40:00
143
转载 float和clear
简介float CSS属性指定一个元素应沿其容器的左侧或右侧放置，允许文本和内联元素环绕它。该元素从网页的正常流动中移除，尽管仍然保持部分的流动性。浮动元素是float值不为none的元素。可能值：left: 表明元素必须浮动在其所在的块容器左侧right: 表明元素必须浮动在其所在的块容器右侧none:元素不进行浮动特点1. 块布局float意味着使用块布局。f...
2018-09-05 10:04:00
282
转载 归并排序的JavaScript实现
思想这是一种分治算法。将原始数组切分成较小的数组，直到每个小数组只有一项，然后在将小数组归并为排好序的较大数组，直到最后得到一个排好序的最大数组。代码function mergeSort(arr) { const length = arr.length; if (length === 1) { //递归算法的停止条件，即为判断数组长度是否为1 ret...
2018-09-02 18:08:00
67
转载 插入排序的JavaScript实现
思想每次在现有已经排好的数组的基础上排入一个新的数组项。先把第一项看做是已经排好的，第二项应该排在第一项之前还是之后呢？当前两项排好后，第三项应该排在这已排好的两项的之前还是之后还是中间呢?当前三项排好后，第四项应该排在这已排好的三项中的什么位置呢?...以此类推。在把新的一项排入已排好的数组项中时，将已排好的项从后往前依次与新的一项比较，如果比新的一项大，那么就依次往后挪一个位...
2018-09-02 17:39:00
84
转载 选择排序的JavaScript实现
思想原址比较的排序算法。即首先找到数结构中的最小值并将其放置在第一位，然后找到第二小的值将其放置在第二位...以此类推。代码function selectionSort(arr) { const length = arr.length; for (let i = 0; i < length - 1; i++) { let minIndex = i; ...
2018-09-02 17:23:00
62
转载 冒泡排序的JavaScript实现
1. 普通冒泡思想假设有n个数，按从小到大排序：进行n-1次外循环，每次外循环会排好当前处理的数中的最大数，即进行第一次外循环排好所有数中的最大数，进行第二次外循环排好所有数中的次大数....直到第n-1次外循环，排好第n-1大的数，也就是倒数第二小的数，那么剩下的那个就是最小的数在第i+1次外循环中，只需要处理前n-i-1个数，因为后面的i+1个数已经排好。即此时内循环需要比...
2018-09-02 17:04:00
115
转载 CSS弹性盒布局
Flexible Box Layout一、Flex布局概述Flex，即Flexible Box, 意为"弹性盒",用于为盒装模型提供最大的灵活性。任何一个容器都可以指定为Flex布局。块级元素可设置display:flex; 行内元素可设置display:inline-flex。webkit内核的浏览器(Chrome,Safari)，需加上-webkit前缀,即-webkit...
2018-08-29 11:20:00
128
转载 CSS冷门但有用的知识整合
1. 滚动条样式设置The ::-webkit-scrollbar CSS pseudo-element(伪元素) affects the style of the scrollbar of an element&.show-pushdown { overflow-x:scroll; &::-webkit-scrollbar { width:8p...
2018-08-29 11:16:00
65
转载 XSS与CSRF攻击
一、XSSCross Site Script,跨站脚本攻击。是指攻击者在网站上注入恶意客户端代码，通过恶意脚本对客户端网页进行篡改，从而在用户浏览网页时，对用户浏览器进行控制或者获取用户隐私数据的一种攻击方式。1.容易发生的场景(1)数据从一个不可靠的链接进入到一个web应用程序。(2)没有过滤掉恶意代码的动态内容被发送给web用户。2.XSS攻击的共同点将一些隐私数据如co...
2018-08-28 11:40:00
91
转载 浅拷贝与深拷贝
问题缘起如果给一个变量赋值一个对象，那么新变量和原对象变量将会是同一个引用，其中一方改变，另一方也会改变。该问题可以用浅拷贝来解决。但是浅拷贝只能解决对象的第一层的引用问题(或数组的第一维)，如果接下去的属性还是对象的话那么还是同一个引用。这就需要引入深拷贝。对象的深浅拷贝1. 浅拷贝: Object.assign({},sourceObj) 或 {...sourceObj}当...
2018-08-21 11:34:00
87
转载 CSS动画复习
一、css动画相关的几个属性属性含义理解transform一种CSS属性。用于修改CSS视觉格式模型的坐标空间。使用它，元素可以被移动（translate）、旋转（rotate）、缩放（scale）、倾斜（skew）。变形translate()CSS属性transform的一种可能值。用于移动元素。平移的变形transition一种CSS属性。...
2018-08-20 10:04:00
84
转载 JavaScript正则常用知识总结
一、JavaScript正则相关方法str.match(regexp)与regexp.exec(str)功能类似。str.search(regexp)与regexp.test(str)功能类似。1. String.prototype.match()检索匹配项，并返回匹配的第一个完整子串及其下捕获组捕获结果构成的数组(无g),或返回匹配的所有的完整子串(有g)语法str.mat...
2018-08-14 11:29:00
107
转载 JavaScript实现继承的几种重要范式
一 原型链1. 代码示例function SuperType() { this.superProperty = true;}SuperType.prototype.getSuperValue = function() { return this.superProperty;}function SubType() { this.subProperty = fal...
2018-08-06 15:33:00
88
转载 JavaScript创建对象的几种重要模式
一、工厂模式1. 代码示例function person(name, age) { var p = new object(); p.name = name; p.age = age; p.sayName = function() { console.log(this.name); }; return p;}var person1 = person...
2018-08-06 15:32:00
61
转载 原型与原型链.
一、创建对象的重要模式： 原型模式面向对象的语言可以通过类创建任意多个具有相同属性和方法的对象。ECMAScript中没有类的概念（在ES6的class之前），但是它的 对象是基于引用类型创建的，可以在一定程度上充当"类“的角色。JavaScript创建对象最常用的方法是使用 Object构造函数（即通过new Object())或 对象字面量。但它们有个明显缺点：如果创建的一堆对象...
2018-08-06 15:28:00
94
转载 节点操作易混点
一、NodeList vs HTMLCollection1.NodeListNodeList是一个 节点的集合, 是由 Node.childNodes 和 document.querySelectorAll 返回的。特点(1) 类数组它是一种类数组对象，用于保存一组有序的节点，可以通过位置(childNodes[index]或childNodes.item(index)) 来访...
2018-07-27 11:15:00
106
转载 JavaScript数组方法总结
数组方法整理方法分类方法名语法描述返回是否改变原数组元素的添加和删除pusharr.push(item1[,item2])把一个或多个元素添加到数组的末尾新数组的长度yesunshiftarr.unshift(item1[,item2])把一个或多个元素添加到数组的头部新数组的长度yespoparr.pop()移除数组最后...
2018-07-24 11:07:00
66
转载 JavaScript类型转换
一、常见类型转换方法1. parseInt()简介parseInt() 方法可以根据给定的进制数把一个字符串解析成整数。parseInt()在转换字符串时：它会忽略字符串前面的空格，直到找到第一个非空格字符。如果第一个非空格字符不是数字字符或符号，就会返回NaN。如果第一个非空格字符是数字字符，它会继续解析第二个字符，直到解析完所有后续字符或者遇到了一个非数字字符。在...
2018-07-22 17:31:00
93
转载 同源策略与跨域技术
一、同源策略浏览器的同源策略限制了 从一个源加载的文档或脚本与来自另一个源的资源的交互。它是隔离潜在恶意文档的关键安全机制。具体限制：不能通过ajax的方法去请求不同源的资源。浏览器中不同域的框架之间是不能进行js的交互操作的。1. 同源的定义如果两个页面具有相同的协议、域名和端口（如果有指定），则这两个页面具有相同的源。Tips:http协议默认端口是80，http...
2018-07-20 18:03:00
453
转载 cookie与web Storage
一、cookie1. http头与cookiecookie是HTTP Cookie的简称。该标准要求:（1）服务器的HTTP响应头包含 Set-Cookie字段响应头Eg:HTTP/1.1 200 OKContent-Type: text/htmlSet-Cookie: name=value该HTTP响应设置了一个名为name，值为value的cookie。服务器将它们...
2018-07-20 17:46:00
97
转载 数据结构-二叉搜索树的js实现
一、树的相关概念1.基本概念子树一个子树由一个节点和它的后代构成。节点的度节点所拥有的子树的个数。树的度树中各节点度的最大值节点的深度节点的深度等于祖先节点的数量树的高度树的高度等于所有节点深度的最大值森林若干课互不相交的树的集合。任何一棵树，删去根节点就变成了森林。2. 二叉树二叉树的定义(1)二叉树中每个节点的度不大于2(2)二叉树是有序的，其子树有...
2018-07-15 17:36:00
360
转载 原型
一、原型模式面向对象的语言可以通过类创建任意多个具有相同属性和方法的对象。ECMAScript中没有类的概念（在ES6的class之前），但是它的 对象是基于引用类型创建的，可以在一定程度上充当"类“的角色。JavaScript创建对象最常用的方法是使用 Object构造函数（即通过new Object())或 对象字面量。但它们有个明显缺点：如果创建的一堆对象中都含有相同的方法，那...
2018-07-11 15:26:00
88
转载 闭包深度理解
一、闭包的概念理解在 定义 某函数的 词法作用域 以外调用该函数时，该函数依然保留有对其 定义时的词法作用域 的引用。那么这个 引用 就叫做闭包。闭包的一些特点:当函数在定义时的词法作用域以外调用时，闭包使得函数可以继续访问其定义时的词法作用域闭包可以阻止内存空间的回收只要使用了回调函数，实际上就在使用闭包Tip: 词法作用域是定义在词法阶段的作用域，即是由 编写代码时...
2018-07-10 15:12:00
130
转载 块级&行内元素总结
一、块级元素与行内元素的区别块级元素与行内元素有几个关键区别：格式默认情况下:块级元素会新起一行；行内元素不会以新行开始.内容模型一般块级元素可以包含行内元素和其他块级元素。这种结构上的包含继承区别可以使块级元素创建比行内元素更”大型“的结构。一般情况下，行内元素只能包含数据和其他行内元素。二、块级元素列表1. 非h5块级元素页面区域划分元素d...
2018-06-24 17:55:00
81
转载 堆排序的JavaScript实现
思想把数组当做二叉树来排序：索引0是树的根节点；除根节点外，索引为N的节点的父节点索引是(N-1)/2；索引为N的节点的左子节点索引是 2*N+1;索引为N的节点的右子节点索引是 2*N+2;关于二叉树相关tips:满二叉树：深度为k且有2^k-1个节点的二叉树完全二叉树：有n个节点的二叉树，当且仅当其每个节点按从上到下、从左至右的顺序进行编号，其编号与满二叉树中1...
2018-06-24 17:08:00
67
转载 快速排序的JavaScript实现
思想分治的思想，将原始数组分为较小的数组（但没有像归并排序一样将它们分隔开）。主元选择： 从数组中任意选择一项作为主元，通常为数组的第一项，即arr[i]；或数组的中间项， arr[Math.floor((i+j)/2)];划分操作： 创建两个指针，左边一个指向数组的第一项，右边一个指向数组的最后一项。向右移动左指针，直到找到一个不小于比主元的项；向左移动右指针，直到找到一个不大...
2018-06-24 17:06:00
61
转载 关于多元素垂直居中
一、场景描述一个高度固定的div，做为父元素。数个高度随机的div,做为子元素，需要在父元素内被垂直居中。二、相关概念回顾1.几种boxinline box：display为inline或inline-block的元素会形成inline box；行内文本会形成inline box；line box：一行内所有的inline boxes会构成line box。其中inli...
2018-06-23 18:55:00
216
转载 load/domContentLoaded事件、异步/延迟Js 与DOM解析
一、DOMContentLoaded 与 load事件关于load和DOMContentLoaded事件，mdn对于它们是这样描述的：DOMContentLoadedmdn文档地址:https://developer.mozilla.org/zh-CN/docs/Web/Events/DOMContentLoadedThe DOMContentLoaded event is fi...
2018-02-05 22:13:00
641
转载 JavaScript运行机制与setTimeout
前段时间，老板交给了我一个任务：通过setTimeout来延后网站某些复杂资源的请求。正好借此机会，将JavaScript运行机制和setTimeout重新认真思考一遍，并将我对它们的理解整理如下。1.JavaScript运行机制核心特征：单线程JavaScript在浏览器中是单线程运行的。所谓单线程，就是同一时刻只执行一个任务，简单来讲，就是任何时刻JS主线程都只有一句JavaS...
2018-01-18 23:19:00
80
转载 理解Promise
一、Propmise基本用法Promise用于发送一个异步完成的结果，是替代回调函数的另一种选择。可以把Promise理解为一种异步函数。以下函数通过一个Promise来异步地返回一个结果function asyncFunc() { return new Promise( function (resolve, reject) { ··...
2018-01-15 22:22:00
178
转载 git常见使用情境整理
一、版本回退回退到某个commit版本的方法如下：1. 查看commit历史git log找到想要回退的版本的号码,eg:f7658892. 回退到该版本git reset f7658893. 查看commit历史git log看看是否最上面一条就是f7658894.进行后续操作git pull二、分支删除详见https://git-scm.com/book/z...
2018-01-15 21:53:00
78
转载 排成一行的li之间的间隙问题
现象对于ul下li排成一行的布局(即li的display由list-item设为inline-block)：情况1如果这些li在书写的时候有换行或者有空格，且ul本身的font-size不为0,那么li左右之间会有空隙:<ul> <li>xxx</li> <li>xxx</li></ul>...
2018-01-15 21:34:00
438
转载 Swift错误处理
相对于可选中运用值的存在与缺失来表达函数的成功与失败，错误处理可以推断失败的原因，并传播至程序的其他部分。throws关键词一个函数可以通过在声明中添加throws关键词来抛出错误消息。 func canThrowAnError() throws { // 这个函数有可能抛出错误 }try关键词当你的函数可能抛出错误消息时, 调用函数时前置try关键词。 tr...
2017-06-29 11:26:00
50
转载 Swift访问控制
参考博客原文链接http://www.jianshu.com/p/604305a61e57http://www.hangge.com/blog/cache/detail_524.html我的总结背景介绍在swift 3中新增加了两种访问控制权限 fileprivate和 open(共5种 open，public，internal，fileprivate，private）。五种...
2017-06-28 15:54:00
56
转载 牛客错题、好题研究整理
在牛客上练习了一些前端的题目，这里部分错题好题小小地整理一番~一、专项练习1.（数组/字符串方法）输出对象中值大于2的key的数组var data = {a: 1, b: 2, c: 3, d: 4};Object.keys(data).filter(function(x) { return___ ;})期待输出：[“c”,”d”]答案： data[x]>2 或 a...
2016-05-15 21:23:00
807
转载 表单脚本
——《JavaScript高级程序设计》Chapter14学习笔记1.表单基础1.取得表单:document.formsvar form1=document.forms[0];var form2=document.forms["form's name"];2.提交表单：三种提交按钮（1）<input type="submit" value="Submit">（...
2016-05-15 21:19:00
77
转载 事件
——《JavaScript高级程序设计》Chapter13学习笔记1.事件处理程序1.HTML事件处理程序1）用法举例方法1：<input type="button" value="click me" onclick="alert('Clicked')"/>方法2：<input type="button" value="click me" onclick=...
2016-05-15 21:15:00
90
转载 DOM基础知识整理
——《JavaScript高级程序设计》Chapter10学习笔记一、节点层次1.Node类型1）(Node).nodeType属性节点nodeType属性有12种。检测nodeType：var someNode=document.body;console.log(someNode.nodeType);//12）(Node).nodeSome属性和.nodeValue属性...
2016-05-15 21:10:00
101
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人