js几道小题

nakyoooooo

已于 2023-05-25 22:01:43 修改

阅读量92

点赞数

文章标签： javascript 开发语言 ecmascript

于 2023-05-25 17:09:21 首次发布

本文链接：https://blog.csdn.net/nakyoooooo/article/details/130871296

版权

给localStorage设置过期时间

重写localStorage的api，在setItem的时候设置expire，在getItem的时候，先判断expire与Date.now()的大小

1.重写setItem:
首先有三个参数 key、value、expired ，分别对应键、值、过期时间，
过期时间的单位可以自由发挥，小时、分钟、天都可以，

注意点：存储的值可能是数组/对象，不能直接存储，需要转换 JSON.stringify，

这个时间如何设置呢？在这个值存入的时候在键(key)的基础上扩展一个字段，如：key+‘expires’，而它的值为当前时间戳 + expired过期时间

set(key, value, expired) {
    let source = this.source;
    source[key] = JSON.stringify(value);
    if (expired){
        source[`${key}__expires__`] = Date.now() + 1000*60*expired
    };
    return value;
}

2.重写getItem:
获取数据时，先判断之前存储的时间有效期，与当前的时间进行对比；
但存储时expired为非必须参数，所以默认为当前时间+1，即长期有效；

如果存储时有设置过期时间，且在获取的时候发现已经小于当前时间戳，则执行删除操作，并返回空值；
注意点：存储的值可能是数组/对象，取出后不能直接返回，需要转换 JSON.parse

get(key) {
    const source = this.source,
    expired = source[`${key}__expires__`]||Date.now+1;
    const now = Date.now();
 
    if ( now >= expired ) {
        this.remove(key);
        return;
    }
    const value = source[key] ? JSON.parse(source[key]) : source[key];
    return value;
}

Promise三个静态方法是怎么实现的

race方法
特征：(1)接收一组promise对象作为参数。(2)返回一个新的promise实例对象。(3)传过来的一组promise实例中，谁最先改变状态完成，返回的promise对象中就包含谁的结果。

static race(promises) {
    // 返回一个新的promise对象
    return new MyPromise((resolve, reject) => {
        // 遍历数组所有实例，根据promise的状态凝固性，最后的结果只会第一次resolve或reject的值
        promises.forEach(item => item.then(res => {
            resolve(res);
        }, err => {
            reject(err);
        }))
    });
}

all方法
特征：(1)传入一组promise实例作为参数。(2)返回一个新的promise对象实例。(3)每组promise实例的结果按照其顺序一一存储在一组数组作为promise实例结果返回。(4)只要其中一个实例出现问题就直接reject出去

static all(promises) {
    return new MyPromise((resolve, reject) => {
        let result = [];
        let times = 0;

            // 将成功结果放入数组中对应的位置
        const processSuccess = (index, val) => {
            result[index] = val;
            if (++times === promises.length) {
                resolve(result); // 全部执行成功，返回 result
            }
        };
            // 遍历处理集合中的每一个 promise
        for (let i = 0; i < promises.length; i++) { 
            promises[i].then(
                data=>processSuccess(i, data), // 按照执行顺序存放执行结果, 
                err => reject(err)
            );
        }
    });
}

怎么查看cookie

1.通过浏览器控制台
在控制台输入 console.log(document.cookie) 回车打印Cookies
2.在浏览器的开发者工具调试面板中
找到并点击Application选项，点开左侧的Cookie选项即可查看cookie

面向对象三大基本特性

分别是：封装，继承，多态
1.封装
就是把客观事物封装成抽象的类。在一个对象内部，某些代码或某些数据可以是私有的，不能被外界访问。
2.继承
在 js中子类使用关键词 extend 去继承父类的关系。
3.多态
不同类的对象对同一消息作出不同的响应叫做多态。多态存在的三个条件：有继承关系、
子类重写了父类方法、父类引用指向子类对象

Set数据结构

1.特点
Set有点类似于Array数组，但是和数组的区别是Set的元素不能重复。
2.Set常用功能之数组去重
如果一个数组有重复的元素，使用Set就能很快去除重复的元素。

  const array = [10, 10, 12, 12, 12, 15, 17]
  const set = new Set(array)
  const newArray = Array.from(set)
  const newArray1 = [...set]
  console.log(set)           //Set(4){10,12,15,17}
  console.log(newArray)     //[10,12,15,17]
  console.log(newArray1)    //[10,12,15,17]