2022 web前端面试题【2】 — JS篇-小月博客

2022 web前端面试题【2】 — JS篇

今天整理了有关JS的相关面试题，都是比较基础并且出现频率很高的面试题，今天分享的主题是【变量类型和计算】来一起看看吧！

常见问题：

—【1】typeof 能判断哪些类型？
—【2】何时使用 === 何时使用 == ？
—【3】值类型和引用类型的区别？
—【4】手写深拷贝

这些问题熟悉吗？你能快速回答上来几个呢？如果不想看文章也可以通过视频讲解来学习===> 《快速搞定前端技术一面匹配大厂面试要求》百度云下载

问题解答：

1、变量类型有什么？

值类型
引用类型

值类型

引用类型

案例【1】：

// 值类型：各论个的不会相互干扰
let a = 100
let b = a
a = 200
console.log(b) //100

案例【2】：

// 引用类型
let a = { age: 20 }
let b = a
b.age = 21
console.log(a.age) //21

// 常见的值类型
let a //undefined
const s = 'abc'
const n = 100
const b = true
const s = Symbol('s')

// 常见引用类型
const obj = {X:100}
const arr = ['a', 'b', 'c']
const n = null // 特殊的引用类型，指针指向为空地址
// 特殊引用类型，但不用存储数据，所以没有“拷贝，复制函数”这一说
function fn() {}

2、typeof 运算符

【1】typeof的作用有什么呢？

识别所有的值类型
识别函数
判断是否是引用类型（不可再细分）

3、手写深拷贝（必考知识点）

⚠️注意：为什么要深拷贝？如何深拷贝？

注意判断值类型和引用类型
注意判断是数组还是对象
递归

上代码–>

const obj1 = {
    age: 20,
    name: '小月博客',
    address: {
        city: "BeiJing"
    },
    arr: ['a','b','c']
}

const obj2 = deepClone(obj1)

/**
* 深拷贝
* @param {Object} obj 深拷贝对象 
*/
function deepClone(obj = {}){

    // 判断传入的是否是对象或者数组
    if(typeof obj !== 'object' || obj == null) {
        // obj是null ，或者不是对象和数组，直接返回
        return obj
    }

    // 返回初始化结果
    let result
    if(obj instanceof Array) {
        result = []
    } else {
        result = {}
    }

    for(let key in obj) {
        // 保证 key 不是原型的属性
        if(obj.hasOwnProperty(key)) {
            result[key] = deepClone(obj[key])
        }
    }
    return result
}

4、变量计算–类型转换

变量计算也是最常见的面试类型了，下面我们由图片呈现一下基本案例