手写JS函数

1.Promise.all

function selfPromiseAll (arr) {
    if(!Array.isArray(arr)){
        return new Error('arr must be an array')
    }
    return new Promise((resolve,reject) => {
        let result = [];
        let count = 0;
        arr.forEach((promise,index) => {
            promise.then(res => {
                result[index] = res;
                count++;
                count === arr.length && resolve(result);
            },err => {
                reject(err)
            })
        })
    })
}
let p1 = Promise.resolve(1);
let p2 = Promise.resolve(2);
let p3 = Promise.reject(3);
selfPromiseAll([p1,p2,p3]).then(res => {
    console.log(res)
}).catch(err => {
    console.log('err',err)
})

2.数组扁平化并去除重复数据，得到一个升序且不重复的数组

function flatSort(arr){
    function flat(arr){
        let flag = arr.some(item => item instanceof Array);
        if(!flag){
            return arr;
        }
        return flat(Array.prototype.concat.apply([],arr));
    }
    let flatRes = flat(arr);
    let derep = Array.from(new Set(flatRes));
    let res = derep.sort((a,b) => a-b);
    return res;
}
console.log(flatSort([3,[10,[1,2]]]));//[1, 2, 3, 10]

3.使用数组reduce实现map方法

Array.prototype.selfMap = function(callback){
    let arr = this;
    let res = arr.reduce((acc,cur,index,array) => {
        acc[index] = callback.call(array,cur);
        return acc;
    },[])
    return res;
}
let res = [1,2,3].selfMap(item => {
    return item*2
})
console.log(res)

4.merge函数

function merge(arr1,arr2){
    let arr3 = arr1.concat(arr2);
    arr3 = [...new Set(arr3)];
    arr3.sort((a,b) => a-b);
    return arr3;
}
console.log(merge([1,3,5],[2,4]))

5.实现trans方法

//trans('get-element-by-id'); // 'getElementById'
function trans(str){
    let res = '';
    let arr = str.split('-');
    arr.forEach(item => {
        res += item;
    })
    return res;
}
console.log(trans('get-element-by-id'))

6.手写Promise加载图片

function imgload(src){
    return new Promise((resolve,reject) => {
        const img = document.createElement('img');
        imgonload = () => {
            resolve(img)
        }
        img.onerror = () => {
            const err = new Error('加载失败');
            reject(err);
        }
        img.src = src;
    })
}

7.Promise写ajax

function ajax(url){
    return new Promise((resolve,reject) => {
        const xhr = new XMLHttpRequest();
        xhr.open('GET',url,true);
        xhr.onreadystatechange = function(){
            if(xhr.readyState === 4){
                if(xhr.status = 200){
                    resolve(JSON.parse(xhr.responseText))
                }else if(xhr.status === 404){
                    reject(new Error('404 not found'))
                }
            }
        }
        xhr.send()
    })
}

8.手写深拷贝

function deepClone (obj){
  if(typeof obj !== 'object' || obj === null){
      return obj;
  }
  let res;
  if(obj instanceof Array){
      res = [];
  }else{
      res = {};
  }
  for(let key in obj){
      if(obj.hasOwnProperty(key)){
          res[key] = deepClone(obj[key])
      }
  }
  return res;
}