Js面试手写题第一天

前言

❓有任何疑问都可以私信我解答

⚡仓库地址：​https://gitee.com/super_li_yu/jsexamdemo

📌每天4道Js手写题，打卡第一天。

😛建议关注，持续更新。

数据类型判断

需求：编写一个函数，实现数据类型的判断，typeof实现的数据类型判断有一定的缺陷。

🔑 使用Object.prototype实现。

var str = "hello"
var arr = [0, 1, 2]
//数据类型的判断方法一
function typeofmethod(obj) {
  let res = Object.prototype.toString.call(obj).split(' ')[1];
  res = res.slice(0, res.length - 1).toLowerCase();
  return res;
}

//数据类型的判断方法二
function typeofmethod2(obj) {
  return Object.prototype.toString.call(obj).slice(8, - 1).toLowerCase();
}


console.log("第二种判断方法:" + typeofmethod2(str));
console.log("第一种判断方法:" + typeofmethod(str));

数组去重

需求：编写一个函数，实现数组去重。

//定义数组
var arr = [1, 2, 3, 3, 4, 4, 4, 5];



//ES5实现
function unique(arr) {
  var res = arr.filter(function (item, index, array) {
    return array.indexOf(item) == index;
  })
  return res
}

//ES6实现
var newarr = arr => [...new Set(arr)];


console.log(unique(arr));
// console.log(newarr);

浅拷贝

/**
 * 简单版深拷贝，只考虑普通对象属性，不考虑内置对象和函数,使用deepclone进行克隆。
 * 高级版深拷贝, 使用通过Object.create和Object.defineProperty获取对象的所有属性，返回一个新的对象
 */


//待拷贝对象
var pserson = {
  name: '休闲玩家Mick',
  url: 'www.liyublogs.top',
  age: 18,
  f: function () {
    this.age = 22
  },
  date: new Date()
}

function deepClone(obj) {
  //先对传入的实参进行判断，若不是对象类型，则直接返回.
  if (typeof obj !== 'object') {
    return;
  }
  var newObj = obj.constructor === Array ? [] : {};
  //遍历函数的键值
  for (let key in obj) {
    //判断对象里是否有该属性
    if (obj.hasOwnProperty(key)) {
      newObj[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key]
    }
  }
  return newObj
}

/**
 * 上面的方法无法拷贝Data对象.
 */
console.log(deepClone(pserson))

深拷贝

/**
 * 简单版深拷贝，只考虑普通对象属性，不考虑内置对象和函数,使用deepclone进行克隆。
 * 高级版深拷贝, 使用通过Object.create和Object.defineProperty获取对象的所有属性，返回一个新的对象
 */


//待拷贝对象
var pserson = {
  name: '休闲玩家Mick',
  url: 'www.liyublogs.top',
  age: 18,
  f: function () {
    this.age = 22
  },
  date: new Date(),
  rex: new RegExp(),
}


/**
 * 方法一
 */
function deepClone(obj) {
  //先对传入的实参进行判断，若不是对象类型，则直接返回.
  if (typeof obj !== 'object') {
    return;
  }
  var newObj = obj.constructor === Array ? [] : {};
  //遍历函数的键值
  for (let key in obj) {
    //判断对象里是否有该属性
    if (obj.hasOwnProperty(key)) {
      newObj[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key]
    }
  }
  return newObj
}

/**
 * 上面的方法无法拷贝Data对象.
 * Object.getPrototypeOf()
 */
console.log(deepClone(pserson))


/**
 * 方法二
 */
function deepClone2(obj) {
  /**
   * 使用Object.create创建对象
   * 
   */
  var newObj = Object.create(Object.getPrototypeOf(obj));
  copyOwnPropertiesFrom(newObj, obj);
  return newObj;
}

function copyOwnPropertiesFrom(target, source) {
  Object.getOwnPropertyNames(source).forEach(item => {
    //获取每个属性的所有描述,然后重新定义对象的属性返回此对象
    var desc = Object.getOwnPropertyDescriptor(source, item);
    Object.defineProperty(target, item, desc);
  })

  return target;
}

console.log(deepClone2(pserson))