【九月打卡】第9天 前端工程师2022版 就业必备基础技术面试分析

课程名称：JS基础与变量类型计算

课程章节：Javascript面试课

课程讲师： 双越

课程内容：

一、变量类型和计算

1.值类型和引用类型的区别（有可能是场景题）

题目：

const obj1 = { x:100, y:200 }
const obj2 = obj1
let x1 = obj1.x
obj2.x = 101
x1 = 102
console.log(obj1)   //{x:101,y:200}

①值类型（值类型，互不干扰）

let a = 100
let b = a
a = 200
console.log(b) //100

②引用类型（把a赋值给b,b改变，a也会跟着改变）

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

③常见的值类型

let a //undefined      //undefined
const s = 'abc'        //字符串
const n = 100          //数字
const b = true         //布尔值
const s = Symbol('s')  //es6 symbol

④常见的引用类型

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

2.typeof 能判断哪些类型？

①识别所有值类型

let a;                    typeof a   //'undefined'
const str = 'abc';        typeof str //'string'
const n = 1000;           typeof n   //'number'
const b = true;           typeof b   //'boolean'
const s = Symbol('s');    typeof s   //'Symbol'

②识别函数

typeof console.log    //'function'
typeof function () {} //'function'

③判断是否是引用类型

typeof null      //'object'
typeof ['a','b'] //'object'
typeof {x:100}   //'object'

3.手写深拷贝

注意判断值类型和引用类型

注意判断数组还是对象

递归

/**
 * 深拷贝
 */
const obj1 = {
    age: 20,
    name: 'lee',
    address: {
        city: 'suzhou'
    },
    arr: ['a', 'b', 'c']
}

// 重新赋值obj2
const obj2 = deepClone(obj1);
obj2.address.city = 'nanjing';
obj2.arr[0] = 'a1';
console.log(obj1.address.city);  //suzhou
console.log(obj1.arr[0]);  //a
/**
 * 深拷贝
 * @param {object} obj 要拷贝的对象
 */
function deepClone(obj = {}) {
    // obj 是 null ，或者不是对象和数组，直接返回
    if (typeof obj !== 'object' || 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.何时使用 === 何时使用 ==

const obj = { x: 100 }
if (obj.a == null) {}
//相当于 if(obj.a === null || obj.a === undefined){}

5.if语句和逻辑运算

!!0 === false
!!NaN === false
!!'' === false
!!null === false
!!undefined === false
!!false === false

背诵全文