2022年前端面试题目及知识点

_Root___

已于 2022-09-22 09:43:36 修改

阅读量283

点赞数

分类专栏：面试文章标签：前端面试 js css html

于 2022-09-18 21:04:30 首次发布

本文链接：https://blog.csdn.net/qq_33281069/article/details/126921752

版权

面试专栏收录该内容

1 篇文章 0 订阅

订阅专栏

前端复习导图

Javascript基础
Typescript
ES系列
CSS基础
框架（React、Vue）
小程序
Node.js
工程化
数据结构
算法
安全
设计模式

前言

兜兜转转在前端好几年，之前也分享过很多前端小点的文章，现在打算把前端需要的基础知识、面试的内容做一个前面的整理。

Javascript基础

数据结构

数据结构类型

前端一共有5种基础数据结构，Null，undefined，Boolean，Number，String
ES6新增：Symbol：每一个 Symbol 的值都是不相等的，所以 Symbol 作为对象的属性名，可以保证属性不重名。
ES10新增：BigInt：该数据类型的目的是比Number数据类型支持的范围更大的整数值

引用数据类型

引用数据类型: Object。
Object类型包含Object、Array、 function、Date、RegExp。
引用数据类型可以添加和删除属性，同时引用属性的值可以改变

判断数据结构类型的方法
常用的方法有三种，其中各有利弊

typeof：最普通的判断方法，可以判断基础数据类型，但是无法判断引用数据类型。返回一个字符串，表示未经计算的操作数的类型
Object.prototype.toString.call()：常用的判断方式，基本可以做到准确判断
Instanceof、constructor：可以判断引用数据类型而不能判断基本数据类型，本质上是判断prototype 属性是否出现在某个实例对象的原型链上 e.g object instanceof constructor

console.log(typeof 1);    // number
console.log(typeof Math.LN2); // number
console.log(typeof Infinity); // number
console.log(typeof NaN); // number
console.log(typeof 'bla'); // string
console.log(typeof true); // boolean
console.log(typeof false); // boolean
console.log(typeof undefined); // undefined
console.log(typeof new Date()); // object
console.log(typeof null); // object
console.log(typeof {}); // object
console.log(typeof [1,2,3]); // object
console.log(typeof function(){}); // function

let nonObj = Object.create(null);
console.log(nonObj instanceof Object);  // false，一种创建非 Object 实例的对象的方法
console.log({test：1} instanceof Object);  // true
console.log(({test：1}).constructor === Object); // true
console.log((1).constructor === Number); // true
console.log([] instanceof Array);    // true
console.log(([]).constructor === Array); // true
console.log(function(){} instanceof Function);       // true
console.log((function() {}).constructor === Function); // true
console.log((true).constructor === Boolean); // true
console.log(('string') instanceof String); // false 并不是对象
console.log(('string').constructor === String); // true

let strFunc = Object.prototype.toString;
console.log(strFunc.call(1)); // [object Array]
console.log(strFunc.call(null)); // [object Null]
console.log(strFunc.call(true)); // [object Boolean]
console.log(strFunc.call('str')); // [object String]
console.log(strFunc.call([])); // [object Array]
console.log(strFunc.call({})); // [object Object]
console.log(strFunc.call(undefined)); // [object Undefined]
console.log(strFunc.call(function(){})); // [object Function]
console.log(strFunc.call(/^\[object (.*)\]$/)); // [object RegExp]