Js面试通

Javascript面试通

js中有哪些基本数据类型

• String
• boolean
• number
• undefined
• Object
• Symbol
• nulll

let、var、const之间的区别

let和var的区别主要在于作用域

let是块级作用域，var是函数作用域

这里要先提一下变量提升

    console.log(a); //undefined 这里变量还未声明就已经存在了
    var a = 10;

变量提升是源于引擎的编译顺序，这里简单说一下，其实var声明变量执行循序是这样的

    var a; //先创建变量空间
    console.log(a); //继续执行下面的语句
    a = 10; // 再给a赋值

至于如何是这样这里不过多解释，这就是变量提升产生的原因

区别	let	var
是否能重复声明	否	是
是否能变量提升	否	是
作用域	块作用域	函数作用域

作用域在这里特别演示一下

var的作用域 {} 并不能限制

{
let c = 3;
var d = 4;
}
console.log(c); //Uncaught ReferenceError: c is not defined
console.log(d); // 4

const和let的区别

区别	let	const
声明必须赋值	声明可以不赋值	声明时必须赋值否则报错
是否可以重复赋值	可以重复赋值	不可能重复赋值，但是引用类型可以改变内部的

下面来看一个列子

const obj = {}
obj.test = '123';  //这里const声明可以改变里面的属性
console.log(obj); //{test:123}
const arr = []; //数组也可以添加元素
arr.push('test')
console.log(arr);// array(1)

obj = {}; //但是这里赋值是改变引用的地址 所以报错不可重复赋值
arr= [''] // 报错 这里也是改变了引用地址

call、bind、apply的区别

call用法: function call(thisArg,arg1,arg2,…)

apply用法：function.apply(thisArg, [argsArray])

call用法: function.bind(thisArg[, arg1[, arg2[, …]]])

三者相同点：call和apply两者都是用来改变this的指向

不同点： call与apply区别主要在于参数,call接收的参数是参数列表而apply参数是参数数组，

bind与call和apply最主要的区别是bind会返回一个新绑定this的函数

深拷贝和浅拷贝

深浅拷贝可以说在很多面试过程中都会提问的一个问题！

深浅拷贝的问题主要出现在基本类型和引用类型的区别之上

基本类型：基本类型是指变量所指的内存区域存放的是值

引用类型：变量所指的内存空间是地址

基本与引用的区别就是变量指向的内存空间不同。

例如以下代码

    var person = {
        name: '张三',
        age: 18,
    };
    var lisi = person;
    lisi.name = '李四';
    console.log(person.name); //  李四
    console.log(lisi.name);//李四

其实上述代码在变量的指向如图所示

可以看出person和lisi都是指向同一个块内存区域

所以改变lisi也会影响person的值，这就是深浅拷贝最明显的区别, =也是浅拷贝的一种，但是深浅拷贝只对引用类型有区别，如果变量为基本类型则无深浅拷贝之说。这里不过多解释，因为基本类型都是重新指向新的内存区域

    let a = 1;
    let b = a;
    b = 3;
    console.log(a); //1
    console.log(b);//3

到这里大家应该知道深浅拷贝的具体区别了。

接下来解释js中深浅拷贝的方法

JSON.stringify和JSON.parse

    var person = {
        name: '张三',
        age: 18,
    };
    var lisi = JSON.parse(JSON.stringify(person));
    lisi.name = '李四';
    console.log(person.name); //  张三
    console.log(lisi.name);//李四

方法的局限:

1.不能复制function、正则、Symbol

    var person = {
        name: '张三',
        age: 18,
        syb: Symbol('aa'),
        reg: /aasd/,
        getInfo: () => {
            return name + age;
        }
    };
    var lisi = JSON.parse(JSON.stringify(person));
    console.log(lisi);

递归深拷贝

    var person = {
        name: '张三',
        age: 18,
        syb: Symbol('aa'),
        date: new Date(),
        reg: /正则/ig,
        getInfo: () => {
            return name + age;
        }
    };

    function isObj(obj) {
        return (typeof obj === 'objct' || typeof obj === 'function' && obj !== null)
    }
    function deepCopy(obj) {
        let tempObj = Array.isArray(obj) ? [] : {}
        for (let key in obj) {
            tempObj[key] = isObj(obj[key]) ? deepCopy(obj[key]) : obj[key];
        }
        return obj;
    }
    let lisi = deepCopy(person);
    console.log(lisi);

递归拷贝的效果最好，基本没有局限性.

浅拷贝的方法:

• Object.assingb()

• {…obj}

事件冒泡和事件捕获

n obj;
}
let lisi = deepCopy(person);
console.log(lisi);

[外链图片转存中...(img-61gKgUba-1616207494245)]

递归拷贝的效果最好，基本没有局限性.

`浅拷贝的方法`:

- Object.assingb()

- {..obj}

  

## 事件冒泡和事件捕获