前端面试常见知识点整理

Author Avatar
ibcLee 2月 28, 2017 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// 数组去重的三种方法

Array.protype.unque1 = function(){
	var n = []
	for(var i = 0; i < this.length; i++){
		// 如果当前数组的第i已经保存进了临时数组，那么跳过，否则把当前项push到临时数组
		if(n.indexOf(this[i] == -1))
			n.push(this[i])
	}
	return n
}

Array.prototype.unique2 = function(){
	var n = {}, r = []
	for( var i = 0; i < this.length; i++ ){
		if (!n[this[i]]){  // 如果hash表中没有当前项
			n[this[i]] = true // 存入hash表
			r.push(this[i]) // 把当前数组的当前项push到临时数组
			
		}
	}
	return r
}

Array.prototype.unique3 = function(){
	var n = [this[0]]
	for (var i = 1; i < this.length; i++){ // 从第二项开始遍历
		// 如果当前数组的第i项在当前数组第一次出现的位置不是i，那么表示第i项是重复的，忽略掉，否则存入数组
		if ( this.indexOf(this[i]) == i )
			n.push(this[i])
	}
	return n
}
1
2
3
4
5
6
7
8
9
10
// 求一个字符串的字节长度，一个英文占用一个字节，一个中文字符占用两个字节
function getBytes(str){
	var len = str.length
	var bytes = len
	for( var i = 0; i < len; i++ ){
		if(str.charCodeAt(i) > 255)
			bytes++
	}
	return bytes
}
1
2
3
4
5
6
7
8
// 实现一个函数clone， 可以对Javascript中的5种主要的数据类型进行值复制
Object.prototype.clone = function(){
	var o = this.constructor === Array ? [] : {}
	for( var e in this ){
		o[e] = typeof this[e] === "object" ? this[e].clone() : this[e]
	}
	return o
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
// HTTP状态码
100  Continue  继续，一般在发送post请求时，已发送了http header之后服务端将返回此信息，表示确认，之后发送具体参数信息

200  OK   正常返回信息

201  Created  请求成功并且服务器创建了新的资源

202  Accepted  服务器已接受请求，但尚未处理

301  Moved Permanently  请求的网页已永久移动到新位置。

302 Found  临时性重定向。

303 See Other  临时性重定向，且总是使用 GET 请求新的 URI。

304  Not Modified  自从上次请求后，请求的网页未修改过。

400 Bad Request  服务器无法理解请求的格式，客户端不应当尝试再次使用相同的内容发起请求。

401 Unauthorized  请求未授权。

403 Forbidden  禁止访问。

404 Not Found  找不到如何与 URI 相匹配的资源。

500 Internal Server Error  最常见的服务器端错误。

503 Service Unavailable 服务器端暂时无法处理请求（可能是过载或维护）。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 统计字符串“aaaabbbccccddefhu”中字母个数或统计最多字母数
var str = "aaaabbbccccddefhu"
var obj = {}
for(var i = 0;i < str.length;i++){
	var v = str.charAt(i)
	if(obj[v] && obj[v].value == v){
		obj[v].count = ++obj[v].count
	}else{
		obj[v] = {}
		obj[v].count = 1
		obj[v].value = v
	}
}
for(key in obj){
	console.log(obj[key].value + "=" + obj[key].count + " ")
}
1
2
3
4
5
6
// 清除字符串前后的空格
function trim(str){
	if(str && typeof str === "string"){
		return str.replace(/\s/g,"")
	}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
/**
 * 快速排序：
 * 1. 在数据集之中，找一个基准点
 * 2. 建立两个数组， 分别存储左边和右边的数组
 * 3. 利用递归进行下次比较
**/
function quickSort(arr){
	if(arr.length<=1){
		return arr // 如果数组只有一个值，就直接返回
	}
	var num = Math.floor(arr.length/2) // 找到中间数的索引值，如果是浮点数，则向下取整
	var numValue = arr.splice(num,1) // 找到中间数的值
	var left = [], right = []
	for(var i=0;i<arr.length;i++){
		if(arr[i]<numValue){
			left.push(arr[i])
		}else{
			right.push(arr[i])
		}
	}
	return quickSort(left).contact([numValue], quickSort(right))  // 递归不断重复比较
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
/**
 * 选择排序：
 * 1. 首先在未排序序列中找到最大（小）元素，存放在排序序列的起始位置
 * 2. 再从剩余未排序元素中继续寻找最大（小）元素，然后放到已排序序列的末尾
 * 3. 重复第二步，直到所有元素均排序完毕 
**/

function selectionSort(arr){
	var len = arr.length, minIndex, temp
	for(var i = 0; i < len - 1;i++){
		minIndex = i
		for(var j = i + 1; j < len; j++){
			if(arr[j] < arr[minIndex]){
				minIndex = j
			}
		}
		temp = arr[i]
		arr[i] = arr[minIndex]
		arr[minIndex] = temp
	}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/**
 * 插入排序：
 * 1. 将第一待排序序列第一个元素看作一个有序序列，把第二个元素到最后一个元素当成是未排序序列
 * 2. 从头到尾一次扫描未排序序列，将扫描到的每个元素插到有序序列的适当位置
**/

function insertionSort(arr){
	var len = arr.length, preIndex, current
	for(var i = 1; i < len; i++){
		preIndex = i - 1
		current = arr[i]
		while(preIndex >= 0 && arr[preIndex] > current){
			arr[preIndex+1] = arr[preIndex]
			preIndex--
		}
		arr[preIndex+1] = current
	}
	return arr
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 冒泡排序
function bubbleSort(arr){
	var i = j = 0
	for(i = 1; i < arr.length; i++){
		for(j = 0; j < arr.length - i; j++){
			if(arr[j] > arr[j+1]){
				var temp = 0
				temp = arr[j]
				arr[j] = arr[j+1]
				arr[j+1] = temp
			}
		}
	}
	return arr
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
// 二路归并
function mergeSort(arr) {  // 采用自上而下的递归方法
    var len = arr.length;
    if(len < 2) {
        return arr;
    }
    var middle = Math.floor(len / 2),
        left = arr.slice(0, middle),
        right = arr.slice(middle);
    return merge(mergeSort(left), mergeSort(right));
}

function merge(left, right){
	var result = [], il = 0, ir = 0
	while(il < left.length && ir < right.length){
		if( left[il] < right[ir] ){
			result.push(left[il++])
		}else{
			result.push[right[ir++]]
		}
	}
	while(left[il]){
		result.push(left[il++])
	}
	while(right[ir]){
		result.push(right[ir++])
	}
	return result
}
1
2
3
4
5
6
7
8
9
10
11
12
// 判断回文字符串
function palindrome(str){
	var re = /[\W_]/g    // \W匹配任何非单词字符
	// 将字符串变成小写字符，并干掉除字母数字外的字符
	var lowRegStr = str.toLowerCase().replace(re, '')
	// 如果字符串lowRegStr的长度为0， 字符串即是palindrome
	if(lowRegStr.length == 0) return true
	// 如果字符串的第一个和最后一个字符不相同，那么字符串就不是palindrome
	if(lowRegStr[0]!=lowRegStr[lowRegStr.length-1]) reutrn false
	// 递归
	return palindrome(lowRegStr.slice(1, lowRegStr.length-1))
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 翻转字符串的两种方法
function reverseString(str){
	var temp = ""
	for(var i = str.length-1; i >= 0; i--)
		temp += str[i]
	return tmp
}

function reverseString(str){
	var arr = str.split("")
	var i = 0, j = arr.length - 1
	while(i<j){
		temp = arr[i]
		arr[i] = arr[j]
		arr[j] = temp
		i++
		j--
	}
	return arr.join("")
}
1
2
3
4
5
6
7
8
9
// 生成指定长度随机字符串
function randomString(n){
	var str = "abcdefghijklmnopqrstuvwxyz0123456789"
	var tmp = ""
	for(var i=0; i < n; i++){
		temp += str.charAt(Math.round(Math.random()*str.length))
	}
	return temp
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
# 阶乘
### 非递归实现   对已排序数组
function factorialize(num){
	var result = 1
	if(num < 0) return -1
	if(num == 0 || num == 1) return 1
	while(num > 1){
		result *= num--
	}
	return result
}

### 递归实现
function factorialize(num){
	var result = 1
	if(num < 0) return -1
	if(num == 0 || num == 1) return 1
	if(num > 1) return num * factorialize(num-1)
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
# 生成菲波那切数列
## 强行递归实现
function getfib(n){
	if(n == 0) return 0
	if(n == 1) return 1
	if(n > 1) return getfib(n-1) + getfib(n-2)
}

## 简约非递归实现
function getfib(n){
	var fibarr = []
	var i = 0
	while(i < n){
		if(i <= 1){
			fibarr.push(i)
		}else{
			fibarr.push(fibarr[i-1] + fibarr[i-2])
		}
		i++
	}
	return fibarr
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
# 二分查找
## 非递归实现
function binarySearch(target,arr) {
    var start   = 0;
    var end     = arr.length-1;

    while (start<=end){
        var mid = parseInt(start+(end-start)/2);
        if(target==arr[mid]){
            return mid;
        }else if(target>arr[mid]){
            start   = mid+1;
        }else{
            end     = mid-1;
        }
    }
    return -1;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
## 递归实现
function binarySearch(target,arr,start,end) {
    var start   = start || 0;
    var end     = end || arr.length-1;

    var mid = parseInt(start+(end-start)/2);
    if(target==arr[mid]){
        return mid;
    }else if(target>arr[mid]){
        return binarySearch(target,arr,mid+1,end);
    }else{
        return binarySearch(target,arr,start,mid-1);
    }
    return -1;
}
1
2
3
4
5
6
7
<!--点击获取元素的索引值-->
var li = document.getElementById("target").getElementsByTagName("li")
for(var i = 0; i < li.length; i++){
 li[i].addEventListener("click", function(e){
   console.log([].indexOf.call(this.parentNode.children, this))
 })
}
expand_less keyboard_arrow_left keyboard_arrow_right keyboard_arrow_down add