JS八股记录

ww_lanz

已于 2022-09-28 15:37:03 修改

阅读量280

点赞数

文章标签： javascript json

于 2022-09-28 15:36:35 首次发布

本文链接：https://blog.csdn.net/ww_lanz/article/details/127084748

版权

1.对JSON的理解

2.为什么arguments是伪数组（类数组），如何遍历？

3.箭头函数与普通函数的区别

4.rest参数

5.new操作符的实现原理

1.对JSON的理解

JSON是一种基于文本的轻量级的数据交换格式、它可以被任何的编程语言读取和作为数据格式来传递。在项目开发中，JSON作为前后端数据交换的方式，在前端通过将一个符合JSON格式的数据结构序列化为JSON字符串，然后将它传递到后端，后端通过JSON格式的字符串解析后生成对应的数据结构，以此来实现前后端数据的一个传递。

在JS中提供了两个函数来实现js数据结构和JSON格式的转换处理。

JSON.stringify()函数。通过传入一个符合JSON格式的数据结构，将其转换为一个JSON字符串。如果传入的数据结构不符合JSON格式，那么会对这些值进行特殊处理，使其规范。在前端向后端发送数据时，调用函数将数据对象转换为JSON格式的字符串。
JSON.parse()函数。该函数将JSON字符串转换为一个JS数据结构，如果传入的不是JSON格式的字符串，会抛出错误。

JSON的构成：由键值和键名构成，逗号隔开。

优点：占用空间少、节省内存和传输中网络带宽的开销。

{"key":"value","key1":"value2"}

JSON的数据类型：

{
    "key": "value",    // 文本/字符串
    "key2": -123.456,    // 数字类型    
    "key3": {            // 对象
        "name": "六六",
        "QQ": 123123,
    },
    "key4":[1,2,3],    // 数字数组
    "key5":["a","b","c"],    // 字符串数组
    "key6":[{
        "name": "a",
        "age": 1,
        },{
        "name": "b",
        "QQ": 3,
        },{
        "name": "lc",
        "QQ": 6,
        }],    // 对象数组
    "key7": null    // 空
}

// 取出对象属性
key3.name 
// 取出数组
key4[1]
// 取出数组对象
key6[0].name

换行：\n、\r、\r\n

字符串内的引号：\"

\：\\

2.为什么arguments是伪数组（类数组），如何遍历？

arguments是函数内自带的内置对象，他的属性是从0开始依次递增的，还有length等属性，与数组相似，但是没有数组常见的方法属性，所以叫伪数组。

遍历伪数组，三个方法：

1.将数组方法应用到伪数组上，例如：call、apply

function fn () {
    Array.prototype.forEach.call(arguments, a => console.log(a));
}

2.使用Array.from将类数组转换为数组

function fn () {
    const arrArgs = Array.from(arguments);
    arrArgs.forEach(a => console.log(a));
}

3.使用展开运算符将类数组转换为数组

function fn () {
    const arrArgs = [...arguments];
    arrArgs.forEach(a => console.log(a));
}

3.箭头函数与普通函数的区别

①箭头函数比普通函数更加简洁

如果没有参数，直接写一个空括号就行

let fn = () => {};

如果只有一个参数，括号可以省略

let fn = a => { console.log(a) };

如果代码只有一行，{}可以省略

let fn = a => a*1;

如果函数体不需要返回值，在语句前加一个void关键字。最常见的就是调用一个函数

let fn = () => void doesNoReturn();

②箭头函数没有自己的this

箭头函数不会创建自己的this，所以如果在箭头函数里面使用this，它只会在自己作用域的上一层捕获this当成自己的this来使用。所以箭头函数的this在创建箭头函数时指向就已经确定了，之后都不会再改变。

因为箭头函数没有自己的this值，所以箭头函数不能作为构造函数来使用，不能使用new，否则会抛出错误。

③call()、apply()、bind()方法都不能改变箭头函数内部的this指向

4.rest参数

rest参数被用在函数形参上，用于获取多传入的参数，可以代替函数内的arguments使用。

rest参数搭配的是数组，把多传入的参数放进到数组里面。多用于处理传入的参数个数不确定的时候。

let fn = (a, ...args) => {
    let res = 0;
    for (var i of args) {
        res += i;
        }
        return res;
    }
    console.log(fn(1, 2, 3, 4, 5));
}