【JavaScript面试问题】2. 判断数据类型、数组判断、值复制clone-CSDN博客

本文链接：https://blog.csdn.net/m0_52769805/article/details/124700083

文章目录

2. 判断数据类型typeof、instanceof、Object.prototype.toString.call()、constructor

typeof

typeof ''; // string 有效
typeof 1; // number 有效
typeof Symbol(); // symbol 有效
typeof true; //boolean 有效
typeof undefined; //undefined 有效
typeof null; //object 无效
typeof [] ; //object 无效
typeof new Function(); // function 有效
typeof new Date(); //object 无效
typeof new RegExp(); //object 无效

typeof function结果为function，typeof null和数组、日期等引用类均为Object

instanceof

instanceof (A,B) = {
    var L = A.__proto__;
    var R = B.prototype;
    if(L === R) {
        // A的内部属性 __proto__ 指向 B 的原型对象
        return true;
    }
    return false;
}

原理是检验A是否为B的实例，instanceof 只能用来判断两个对象是否属于实例关系，而不能判断一个对象实例具体属于哪种类型。

constructor

  ''.constructor == String
  Number(1).constructor == Number
  [].constructor == Array
  Symbol.constructor == Symbol
  true.constructor == Boolean

直接通过constructor来判断属于什么类型的数据，但是遇到自定义对象、重写过的prototype则不适用

Object.prototype.toString.call()

Object.prototype.toString.call('') ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(Symbol()); //[object Symbol]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window 是全局对象 global 的引用

2.1 判断数组的几种方式

[] instanceof Array
[].constructor == Array
Object.prototype.toString.call([])
Array.isArray([])
Array.prototype.isPrototypeOf([]) //判断Array是否在[]原型链上

2.2 判断NaN的几种方式

function myIsNaN(num) {
  if (num!=num) {
    return true
  } else {
    return false
  }
}

isNaN(NaN)

2.3 实现一个函数clone，可以对js中的5种主要的数据类型（包括number string object array Boolean）进行值复制

function getData(data){
  let dataType = Object.prototype.toString.call(data).slice(8,-1)
  let copyData = null
  switch(dataType) {
    case 'String':
      copyData =  "'" + data +"'"
      break
    case 'Number':
      copyData = 0 + data
      break
    case 'null':
      copyData = null
      break
    case 'Undefined':
      copyData = "Undefined"
      break
    case 'Boolean':
      copyData = data 
      break
    case 'Array':
      copyData = []
      for(var i=0;i<data.length;i++) {
        copyData[i] = data[i]
      }
      break
    case 'Object':
      copyData = {}
      for (var j in data) {
        copyData[j] = data[j]
      }
      break
    case 'Function':
      copyData = data
      break
  }
  return copyData
}
console.log(getData(123));   
console.log(getData("123"));  
console.log(getData(null));  
console.log(getData(undefined));  
console.log(getData(false));  
console.log(getData([1,2,4]));  
console.log(getData({"name":"wc"}));  
console.log(getData(function(){alert(23);}));

源码

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
</body>

<script>
console.log(typeof NaN);
console.log(typeof '');
console.log(typeof 1);
console.log(typeof Symbol());
console.log(typeof true);
console.log(typeof undefined);
console.log(typeof null);
console.log(typeof [] );
console.log(typeof new Function());
console.log(typeof new Date());
console.log(typeof new RegExp());
console.log('----------------------------------');

  let a= [];
  class person {
    constructor(age){
      this.age=age
    }
    name = 'gg'
  }
  let tom = new person()
  function myInstanceof(a,b){
    let l = a.__proto__
    let r = b.prototype
    return l===r? true:false;
  }
  console.log(myInstanceof(a,Array));
  console.log(a instanceof Array);
  console.log(myInstanceof(tom,person));
  console.log(tom instanceof person);


  console.log('----------------------------');
  console.log(''.constructor == String);
  console.log(Number(1).constructor == Number);
  console.log([].constructor == Array);
  console.log(Symbol.constructor == Symbol);
  console.log(true.constructor == Boolean);

console.log(Array.isArray([1,2,3]));
console.log(isNaN(NaN));
function myIsNaN(num) {
  if (num!=num) {
    return true
  } else {
    return false
  }
}
console.log(myIsNaN(NaN));
console.log("-----------------------------");


function getData(data){
  let dataType = Object.prototype.toString.call(data).slice(8,-1)
  let copyData = null
  switch(dataType) {
    case 'String':
      copyData =  "'" + data +"'"
      break
    case 'Number':
      copyData = 0 + data
      break
    case 'null':
      copyData = null
      break
    case 'Undefined':
      copyData = "Undefined"
      break
    case 'Boolean':
      copyData = data 
      break
    case 'Array':
      copyData = []
      for(var i=0;i<data.length;i++) {
        copyData[i] = data[i]
      }
      break
    case 'Object':
      copyData = {}
      for (var j in data) {
        copyData[j] = data[j]
      }
      break
    case 'Function':
      copyData = data
      break
  }
  return copyData
}
console.log(getData(123));  
console.log(getData("123"));  
console.log(getData(null));  
console.log(getData(undefined));  
console.log(getData(false));  
console.log(getData([1,2,4]));  
console.log(getData({"name":"wc"}));  
console.log(getData(function(){alert(23);}));  
</script>
</html>