Home > Web Front-end > JS Tutorial > body text

Type Utilities - JavaScript Challenges

Mary-Kate Olsen
Release: 2024-10-30 08:12:27
Original
425 people have browsed it

Type Utilities - JavaScript Challenges

Introduction

Checking types is a common practice in JavaScript in everyday coding and technical interviews.

You can find all the code in this post at Github.


Primitive values

In JavaScript, all types except Object define immutable values represented directly at the lowest level of the language. We refer to values of these types as primitive values.

There are 7 primitive values:

  1. Null
  2. Undefined
  3. Boolean
  4. Number
  5. BigInt
  6. String
  7. Symbol

All primitive types, except null, can be tested by the typeof operator. typeof null returns "object", so one has to use === null to test for null.

Therefore, we get the first type utility function.

function isBoolean(value) {
  return typeof value === 'boolean';
}

function isString(value) {
  return typeof value === 'string';
}

function isNumber(value) {
  return typeof value === 'number';
}

function isSymbol(value) {
  return typeof value === 'symbol';
}

function isBigInt(value) {
  return typeof value === 'bigint';
}

function isUndefined(value) {
  return typeof value === 'undefined';
}

function isNull(value) {
  return value === null;
}

// Usage example
console.log(isSymbol(Symbol('test'))); // => true
console.log(isNull(null)); // => true
console.log(isUndefined(undefined)); // => true
console.log(isNumber(1)); // => true
console.log(isString('')); // => true
console.log(isBoolean(true)); // => true
console.log(isBigInt(9007199254740991n)); // => true
Copy after login

Objects

Everything that's not a primitive type is an object in JavaScript. This includes:

  • Plain objects
  • Arrays
  • Functions
  • Dates
  • RegExps
  • Other built-in object types

Here comes the second utility function for Arrays, Functions, Objects.

function isArray(value) {
  return Array.isArray(value);
}

function isFunction(value) {
  return typeof value === 'function';
}

function isObject(value) {
  // for null and undefined
  if (value == null) {
    return false;
  }

  return typeof value === 'object';
}

function isPlainObject(value) {
  // for null and undefined
  if (value == null) {
    return false;
  }

  const prototype = Object.getPrototypeOf(value);
  return prototype === Object.prototype || prototype === null;
}

// Usage example
console.log(isArray(new Array())); // => true
console.log(isObject(Object(null))); // => true
console.log(isFunction(Object.prototype.toString)); // => true
console.log(isPlainObject(Object.create(null))); // => true
Copy after login

Object.prototype.toString.call()

There are several methods to check types in JavaScript, including:

  • typeof for all the primitive types except null.
  • instanceof determines whether an object is an instance of a specific constructor or class. It does not work with primitive values.

Object.prototype.toString.call() is the most reliable method for type checking in JavaScript.

We can extract the types by:

function getType(value) {
  const type = typeof value;

  if (type !== 'object') {
    return type;
  }

  return Object.prototype.toString
    .call(value)
    .slice(8, -1)
    .toLowerCase();
}

// Usage example
console.log(getType(1)); // => number
console.log(getType('')); // => string
console.log(getType({})); // => object
console.log(getType(null)); // => null
console.log(getType(undefined)); // => undefined
console.log(getType(Symbol())); // => symbol
console.log(getType(BigInt(1234567890123456789012345))); // => bigint
console.log(getType(function () {})); // => function
console.log(getType(new Date())); // => date
console.log(getType(new Map())); // => map
console.log(getType(new Set())); // => set 
console.log(getType(new RegExp("cat", "i"))); // => regex
Copy after login

Reference

  • JavaScript data types and data structures - MDN
  • Data types - JavaScript.info
  • Reference Type - JavaScript.info
  • GreatFrontEnd

The above is the detailed content of Type Utilities - JavaScript Challenges. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!