本文介绍: 可能遇到精度丢失问题。JavaScript 使用的是 IEEE 754 浮点数标准,即一种二进制表示法,有时不能准确地表示十进制小数。如果你需要进行精确十进制数值计算可以使用一些处理精确数值的库,比如BigIntDecimal.js或者big.js

1、js两个相加会不会丢精度

可能遇到精度丢失的问题。JavaScript 使用的是 IEEE 754 浮点数标准,即一种二进制表示法,有时不能准确地表示十进制小数。如果你需要进行精确的十进制数值计算可以使用一些处理精确数值的库,比如 BigIntDecimal.js 或者 big.js

2、整数溢出

在 JavaScript 中,整数溢出是指超出了 JavaScript 数值类型范围,导致无法准确表示这个整数。如果需要处理整数可以考虑使用 BigInt 类型或者使用第三方库来处理

3、接口调用超时抛出错误怎么实现

用Promise.race实现,其 接受一个包多个 Promise 的可迭代对象比如数组),并返回一个新的 Promise,该 Promise 将与最先解决(fulfilled)或拒绝rejected)的 值。

function timeoutPromise(ms) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            reject(new Error('接口调用超时'));
        }, ms);
    });
}

function apiCall() {
    return new Promise((resolve, reject) => {
        // 模拟异步接口调用
        setTimeout(() => {
            resolve('接口调用成功');
        }, 500);
    });
}

// 设置超时时间
const timeoutDuration = 300;

// 使用 Promise.race 同时执行接口调用超时 Promise
Promise.race([apiCall(), timeoutPromise(timeoutDuration)])
    .then((result) => {
        // 如果接口调用超时前完成,result 将是接口调用结果
        console.log(result);
    })
    .catch((error) => {
        // 如果超时,或者接口调用出错error 将是相应的错误对象
        console.error(error.message);
    });

4、 发布订阅模式观察者模式区别

4.1 观察者模式

// 被观察者(Subject)
class Subject {
    constructor() {
        this.observers = []; // 观察者列表
    }

    // 添加观察者
    addObserver(observer) {
        this.observers.push(observer);
    }

    // 移除观察者
    removeObserver(observer) {
        this.observers = this.observers.filter(obs => obs !== observer);
    }

    // 通知观察者状态变化
    notifyObservers(message) {
        this.observers.forEach(observer => observer.update(message));
    }
}

// 观察者(Observer)
class Observer {
    constructor(name) {
        this.name = name;
    }

    // 被观察者通知调用方法
    update(message) {
        console.log(`${this.name} 收到通知: ${message}`);
    }
}

// 创建被观察者和观察者
const newsSubject = new Subject();

const observer1 = new Observer('Observer 1');
const observer2 = new Observer('Observer 2');

// 观察者订阅被观察者
newsSubject.addObserver(observer1);
newsSubject.addObserver(observer2);

// 被观察者通知观察者
newsSubject.notifyObservers('新闻更新: 今天发生了一些重要事件。');

4.2 Vue.js 中的响应原理

Object.defineProperty+观察者模式

  1. Observer(观察者):

  2. Dep依赖订阅者):

  3. Watcher(桥梁):

function defineReactive(obj, key, val) {
    let dep = new Dep();

    Object.defineProperty(obj, key, {
        enumerable: true,
        configurable: true,
        get() {
            if (Dep.target) {
                dep.addSub(Dep.target);
            }
            return val;
        },
        set(newVal) {
            if (newVal !== val) {
                val = newVal;
                dep.notify();
            }
        }
    });
}

class Dep {
    constructor() {
        this.subs = [];
    }

    addSub(sub) {
        this.subs.push(sub);
    }

    notify() {
        this.subs.forEach(sub => sub.update());
    }
}

class Watcher {
    constructor() {
        Dep.target = this;
    }

    update() {
        console.log('数据发生变化,执行更新操作');
    }
}

Dep.target = null;

const data = {};
defineReactive(data, 'message', 'Hello, Vue!');

const watcher = new Watcher();

// 模拟触发数据变化
data.message = 'Hello, Vue.js!';

5、迭代器是什么

迭代器(Iterator)是 JavaScript 中的一个接口,它提供了一种顺序访问数据结构(如数组、Map、Set 等)元素方法迭代器对象可以通过 next() 方法依次访问数据结构中的每一个元素,直到数据结构末尾返回一个包含 valuedone 属性的对象。

// 创建一个简单的数组
const myArray = ['apple', 'banana', 'cherry'];

// 获取迭代器对象
const iterator = myArray[Symbol.iterator]();

// 使用迭代器对象遍历数组元素
let result = iterator.next();
while (!result.done) {
  console.log(result.value);
  result = iterator.next();
}

6、前端可以通过文件切片上传断点传输

前端可以通过文件切片上传(File Chunking)的方式实现文件上传,这有助于避免上传过程中遇到的一些问题,例如网络中断导致整个文件上传失败的情况。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>File Chunk Upload</title>
</head>
<body>
  <input type="file" id="fileInput" />
  <button onclick="uploadFile()">Upload</button>

  <script>
    function uploadFile() {
      const fileInput = document.getElementById('fileInput');
      const file = fileInput.files[0];

      const chunkSize = 1024 * 1024; // 1MB
      const totalChunks = Math.ceil(file.size / chunkSize);
      let currentChunk = 0;

      function uploadChunk() {
        const start = currentChunk * chunkSize;
        const end = Math.min((currentChunk + 1) * chunkSize, file.size);
        const chunk = file.slice(start, end);

        const formData = new FormData();
        formData.append('fileChunk', chunk);
        formData.append('totalChunks', totalChunks);
        formData.append('currentChunk', currentChunk);

        // 使用 XMLHttpRequest 或 Fetch API 发送 formData 到服务器
        // ...

        currentChunk++;

        if (currentChunk < totalChunks) {
          // 继续上传下一个块
          uploadChunk();
        } else {
          // 所有块上传完成,服务器处理合并操作
          console.log('File upload complete!');
        }
      }

      // 开始上传第一个uploadChunk();
    }
  </script>
</body>
</html>

6、vue生命周期 datamethod什么时候更新的,什么时候可以拿到vue实例

vue生命周期

created 钩子之后,你可以安全访问操作 datamethods,而在 beforeCreate 钩子中,它们还未被初始化。如果需要初始化阶段执行一些逻辑,可以使用 beforeCreate 钩子。如果需要在 DOM 元素渲染后进行操作,可以使用 mounted 钩子。

7、

原文地址:https://blog.csdn.net/m0_56770663/article/details/134718853

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_30574.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注