希尔排序算法
希尔排序算法算法简介
1959年Shell发明,第一个突破O(n2)的排序算法,是简单插入排序的改进版。它与插入排序的不同之处在于,它会优先比较距离较远的元素。希尔排序又叫缩小增量排序。
算法描述将整个待排序的记录序列分割成为若干子序列分别进行直接插入排序,具体算法描述:
选择一个增量序列t1,t2,…,tk,其中t1>t2>…,tk=1;
按增量序列个数k,对序列进行k 趟排序;
每趟排序,根据对应的增量ti,将待排序列分割成若干长度为m 的子序列,分别对各子表进行直接插入排序。仅增量因子为1 时,整个序列作为一个表来处理,表长度即为整个序列的长度。
代码示例12345678910111213141516171819function shellSort(arr) { let len = arr.length; // gap 即为增量 for (let gap = Math.floor(len / 2); gap > 0; gap = Math.floor(gap / 2)) { for (let i = gap; i < ...
插入排序算法
插入排序算法算法简介
插入排序的代码实现虽然没有冒泡排序和选择排序那么简单粗暴,但它的原理应该是最容易理解的了,因为只要打过扑克牌的人都应该能够秒懂。插入排序是一种最简单直观的排序算法,它的工作原理是通过构建有序序列,对于未排序数据,在已排序序列中从后向前扫描,找到相应位置并插入。
算法步骤将第一待排序序列第一个元素看做一个有序序列,把第二个元素到最后一个元素当成是未排序序列。
从头到尾依次扫描未排序序列,将扫描到的每个元素插入有序序列的适当位置。(如果待插入的元素与有序序列中的某个元素相等,则将待插入元素插入到相等元素的后面。)
动画演示
1234567891011121314function insertionSort(arr) { let len = arr.length; let preIndex, current; for (let i = 1; i < len; i++) { preIndex = i - 1; current = arr[i]; while(preIndex >= ...
快速排序算法
快速排序算法算法简介
快速排序(英语:Quicksort),又称划分交换排序(partition-exchange sort),简称快排,一种排序算法,最早由东尼·霍尔提出。在平均状况下,排序n个项目要O(nLogn)次比较。在最坏状况下则需要O(n^2)次比较,但这种状况并不常见。事实上,快速排序O(nLogn)通常明显比其他算法更快,因为它的内部循环(inner loop)可以在大部分的架构上很有效率地达成。
以下列举两种不同的快排代码进行分析:
快速排序的3个基本步骤
从数组中选择一个元素作为基准点
排序数组,所有比基准值小的元素摆放在左边,而大于基准值的摆放在右边。每次分割结束以后基准值会插入到中间去。
最后利用递归,将摆放在左边的数组和右边的数组在进行一次上述的1和2操作。
为了更深入的理解,可以看下面这张图
我们根据上面这张图,来用文字描述一下
选择左右边的元素为基准数,7
将小于7的放在左边,大于7的放在右边,然后将基准数放到中间
然后再重复操作从左边的数组选择一个基准点2
3比2大则放到基准树的右边
右边的数组也是一样选择12作为基准数,15比12大所以放到了1 ...
url长单词换行
文字换行在一般长文字下,会自动换行,如果不能自动换行可通过以下CSS样式修改
12345678span{ word-break:normal; width:auto; display:block; white-space:pre-wrap; word-wrap : break-word ; overflow: hidden ;}
长url换行想让一个长单词在中间截断换行时,上述方式便不适用,因为其换行原理在于不从一个单词中间截断,因此以下代码才能实现长单词换行功能
123white-space: pre-line; // 处理元素中的空白word-break: break-all;// 单词内断行word-wrap: break-word;// 换行位置 normal只允许在断字点换行 break-word 长单词或url内部换行
选择排序算法
选择排序算法算法简介
选择排序是一个简单直观的排序方法,它的工作原理很简单,首先从未排序序列中找到最大的元素,放到已排序序列的末尾,重复上述步骤,直到所有元素排序完毕。
算法描述
假设未排序序列的第一个是最大值,记下该元素的位置,从前往后比较
若某个元素比该元素大,覆盖之前的位置
重复第二个步骤,直到找到未排序的末尾
将未排序元素的第一个元素和最大元素交换位置
重复前面几个步骤,直到所有元素都已经排序。
算法分析
选择排序的交换操作次数最好情况已经有序为0次,最坏情况逆序n-1次,因此交换操作次数位于0 —— (n-1)次之间;比较操作次数(n-1+…+2+1+0. 为n(n-1)/2次;交换元素赋值操作为3次,逆序需要n-1趟交换,因此,赋值操作位于0 —— 3(n-1)次之间。由于需要交换位置,所以肯定是不稳定的。
时间复杂度均为o(n^2) 空间复杂度为o(1) 不稳定
代码实现12345678910111213141516function selsetSort(arr){ let len = arr.length; let index; for(let ...
冒泡排序算法
冒泡排序算法
对数组进行 冒泡排序 ,是算法当中比较简单易理解的。
原理
数组中有 n 个数,比较每相邻两个数,如果前者大于后者,就把两个数交换位置;这样一来,第一轮就可以选出一个最大的数放在最后面;那么经过 n-1(数组的 length - 1) 轮,就完成了所有数的排序。
首先,通过一次循环,从而找到最大数放于数组队尾
123456789let arr = [3,4,1,2];// 遍历数组,次数就是arr.length - 1for (let i = 0; i < arr.length - 1; i++) { // 如果前一个数 大于 后一个数 就交换两数位置 if (arr[i] > arr[i + 1]) { [arr[i],arr[i + 1]] = [arr[i + 1], arr[i]]; }}console.log(arr) // [3, 1, 2, 4]
总计,重复 arr.length - 1 次,便可以实现数组按从小到大的顺序
1234567891011let arr = [3,4,1,2];// ...
css3动画添加固定时间间隔
在做前端的时候,难免会遇到需要用动画的需求。
思考由于没有相关属性直接定义,就只能使用间接的方式了。就把间隔的时间也加到动画的时间里面。
代码定义一个间隔3秒的动画简单代码如下
1234567891011121314151617181920212223242526272829303132333435@keyframes redpack { 0% { transform: translateY(0); } 75% { transform: translateY(0); } 79% { transform: translateY(5rpx); } 82% { transform: translateY(-20rpx); } 84% { transform: translateY(0rpx); } 87% { transfor ...
React链接跳转
页面点击本地页面打开新页面
引入ant的Button组件1234<Button style={{backgroundColor:'#F0F2F5'}} onClick={()=>{window.location.href="https://baidu.com"}} className="r-button">
引入import {Link} from ‘react-router-dom’123<Link to="/new/login/"><Button className="e-button" type="primary">Back to login page</Button></Link>
带参跳转 引入import { Link} from ‘umi’;123<Link to={{pa ...
Form表单的labelCol,wrapperCol
Form 表单记录
Form 表单的 labelCol,wrapperCol翻阅文档赫然清晰说明了它两的用法:
labelCol: label 标签布局,同 组件,设置 span offset 值,如 {span: 3, offset: 12} 或 sm: {span: 3, offset: 12}。你可以通过 Form 的 labelCol 进行统一设置,,不会作用于嵌套 Item。当和 Form 同时设置时,以 Item 为准。
言下之意就是可以下面两种设置:方法一:
1234567<Form labelCol={{span:3}} wrapperCol={{span:8}}></Form>
方法二:
12345678910111213<Form labelCol={{span:3}} wrapperCol={{span:8}}> <Form.Item > < ...
Form表单的setFieldsValue
Form 表单记录
3.x 版本 antd 文档表明表单项的值不推荐通过设置状态来更新,我们应该使用 form.setFieldValue 来更新
设置一组输入控件的值(注意:不要在 componentWillReceiveProps 内使用,否则会导致死循环)
123({ [fieldName]: value }, callback: Function ) => void
Form.createFormField用于标记 mapPropsToFields 返回的表单域数据
经过 getFieldDecorator 包装的控件,表单控件会自动添加 value(或 valuePropName 指定的其他属性) onChange(或 trigger 指定的其他属性),数据同步将被 Form 接管,这会导致以下结果:
不再需要也不应该用 onChange 来做同步,但还是可以继续监听 onChange 等事件。
不能用控件的 value defaultValue 等属性来设置表单域的值,默认值可以用 getFieldDecorator 里的 i ...