手撕JS面试题大全一

Posted 2021-06-16 三水草肃

冒泡排序

/* 两两比较 */
function bubleSort(arr) {
    var len = arr.length
    for (let outer = len; outer >= 2; outer--) {
        for (let inner = 0; inner <= outer - 1; inner++) {
            if (arr[inner] > arr[inner + 1]) {
                [arr[inner], arr[inner + 1]] = [arr[inner + 1], arr[inner]]
            }
        }
    }
    return arr
}
console.log(bubleSort([1, 2, 5, 44, 56, 5, 85, 5]));

/* 选择排序: 遍历自身以后的元素，最小的元素跟自己调换位置 */
function selectSort(arr) {
    var len = arr.length
    for (let i = 0; i < len - 1; i++) {
        for (let j = 1; j < len; j++) {
            if (arr[i] > arr[j]) {
                [arr[i], arr[j]] = [arr[j], arr[i]];
            }
        }
    }
    return arr
}

解析URL

function parseUrl(url) {
    const urlObj = new URL(url)
    let query = {}
    for (let item of urlObj.search.slice(1).split('&').map(value => value.split('='))) {
        let name = item[0]
        let value = item[1]
        if (name.length) {
            query[name] = value
        }
    }
    urlObj.query = query
    return {
        origin: urlObj.origin,
        protocol: urlObj.protocol,
        host: urlObj.hostname,
        port: urlObj.port,
        pathname: urlObj.pathname,
        search: urlObj.query,
        hash: urlObj.hash,
    }
}
console.log(parseUrl('https://www.naodi.com/path/?a=1&b=2#/hash'));

深拷贝和浅拷贝

深拷贝

方法一：
 JSON.parse(JSON.stringfy())
 
方法二：
 function deepClone(obj) {
    let objClone = Array.isArray(obj) ? [] : {}
    if(obj && typeof obj === 'object') {
        for(key in obj) {
            if(obj.hasOwnProperty(key)) {
                if(obj[key] && typeof obj[key] == 'object') {
                    objClone[key] = deepClone(obj[key])
                }else {
                    objClone[key] = obj[key]
                }
            }
        }
    }
    return objClone
}

浅拷贝

Object.assign()

数组扁平化

方法一：
function flatten(arr) {
    return arr.reduce((prev, curr) => {
        return prev.concat(Array.isArray(curr) ? flatten(curr) : curr)
    }, [])
}
方法二：
function aaa(arr) {
    let res = []
    arr.map(item => {
        if (Array.isArray(item)) {
            res.concat(aaa(item))
        } else {
            res.push(item)
        }
    })
    return res
}

数组去重合并

function combine(){
    let arr = [].concat.apply([], arguments);  //没有去重复的新数组
    return Array.from(new Set(arr));
}

var m = [1, 2, 2], n = [2,3,3];
console.log(combine(m,n)); 
https://developer.mozilla.org/zh-

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/from

实现new

function myNew(fun, ...arg) {
    // 创建一个新对象，并且隐士原型指向构造原型
    let obj = {
        __proto__ = fun.prototype
    }
    fun.apply(obj, arg)
    return obj
}

new实例过程是改变this指向到构造函数

数组常用方法：

• Array.isArray() 用于确定传递的值是否是一个 Array。
  

• Array.of() 返回一个由参数组成的数组
  

•  Array.from() 将数组对象转换为数组 不改变原对象 返回新数组
  

•   pop() 删除数组最后一个元素（改变原数组） 返回被删除的元素
  

•   shift() 删除数组的第一个元素 (改变原数组) 返回被删除的元素
  

•  push() 向末尾添加元素（改变原数组） 返回添加后的length
  

•   unshift() 向数组开头添加元素（改变原数组） 返回添加后数组的length
  

•   reverse() 反转数组 改变原数组
  

•   splice() 添加/删除/替换 当前数组改变
  

•    sort() 数组排序 (改变原数组) 参数为规定排序的比较函数(非必填)
  

•   copyWithin() 数组的指定位置复制[改变原数组、ES6]
  

•   fill()数组的填充 [改变原数组、ES6]
  

•    slice() 拷贝数组元素 [不改变原数组]
  

•    join()将数组转换为字符串[不改变原数组]
  

•    concat() 连接合并多个数组，返回新数组。[不改变原数组]
  

•  toString() 方法可把数组转换为字符串，并返回结果。[不改变原数组]
  

•   indexOf() 查找数组中某元素的第一个索引值。[不改变原数组] 如果没有就返回-1
  

•   lastIndexOf() 逆向查找指定元素在数组中的第一个位置。[不改变原数组]
  

•   includes() 查找数组是否包含某个元素。[不改变原数组,]
  

•  map
  

•  filter
  

• reduce
  

•   forEach
  

• 等等等下次再详细解答~