【JavaScript】Promise(零) —— 准备工作(实例对象、函数对象、回调函数分类、捕获抛出错误)

简介: 【JavaScript】Promise(零) —— 准备工作(实例对象、函数对象、回调函数分类、捕获抛出错误)

一、实例对象和函数对象

1. 函数对象

将函数作为对象使用时,简称为函数对象。

2. 实例对象

new 构造函数或类产生的对象,称之为实例对象。

3. 举例
  // 函数对象
  function Person(name, age){
        this.name = name
        this.age = age
    }
    Person.a = 1  // 将Person看成一个对象
    const p1 = new Person('小宏', 22) //p1是Person的实例对象
    console.log(p1)

8c0073a25d474fdea93115a4dc87cb94.png

二、回调函数的分类

1. 什么是回调?

我们定义的,我们没有调用,最终执行了

2. 同步回调函数
  1. 理解:立即在主线程上回调,不会放入回调队列中。
  2. 例子:数组遍历相关的回调函数 / Promise的executor函数
  let arr = [1, 3, 5, 7, 9]
    arr.forEach((item)=>{
        console.log(item);
    })
    console.log('主线程的代码');

同步的回调:按顺序执行

11893c1c7222444087a24ecb023bf8e0.png

3. 异步回调函数
  1. 理解:不会立即执行,会放入回调队列中以后执行
  2. 例子:定时器回调 / ajax回调 / Promise的成功、失败的回调
  setTimeout(()=>{
        console.log('@');
    }, 1000)
    console.log('主线程的代码');

同步的回调:按队列执行

064d1569cbb34ba687950f024d0c89ff.png

三、JS 中的 Error

1. 错误类型

Error:所有错误的父类型

  1. ReferenceError:引用的变量不存在
  console.log(a);

没有定义,直接输出

1633293696f44532ac36f24b5f69c9df.png

  1. TypeError:数据类型不正确
  const demo = () => {} 
    demo()()

demo() 为undefined,undefined() 为类型错误

75bf341e9bf34875b674f6f7bf4430be.png

  1. RangeError:数据值不在其所允许的范围内——死循环
  const demo = () => {demo()}
    demo()

死循环,队列栈已满

d30c113c716b43719a06f229c58ff218.png

  1. SyntaxError:语法错误
  console.log(1;

语法错误,丢失了半个括号

4fa8d0cc2b424793a20952efeb121c4c.png

2. 捕获错误

捕获错误:使用 try{} catch{}

  try {
        console.log(1);
        console.log(a);
        console.log(2);
    } catch (error) {
        console.log('代码执行错误,错误原因:', error);
    }

使用异常捕获,错误不飘红


a4d55465eef9407f8d5d91597283ef5d.png

3. 抛出错误

抛出错误:throw error

  function demo() {
        const date = Date.now()
        if (date % 2 === 0) {
            console.log('偶数,可以正常工作');
        } else {
            throw new Error('奇数,不可以工作')
        }
    }
    try {
        demo()
    } catch (error) {
        console.log('@', error);
    }

获取时间戳,偶数可工作,奇数不可工作

1faa76b165c041ea838029cb7d41ebf2.png

8be0bd6cbdab4b4fa06541a19fe52d19.png

不积跬步无以至千里 不积小流无以成江海

相关文章
|
10月前
|
前端开发 JavaScript API
JavaScript异步编程:从Promise到async/await
JavaScript异步编程:从Promise到async/await
714 204
|
8月前
|
前端开发 JavaScript API
js实现promise常用场景使用示例
本文介绍JavaScript中Promise的6种常用场景:异步请求、定时器封装、并行执行、竞速操作、任务队列及与async/await结合使用,通过实用示例展示如何优雅处理异步逻辑,避免回调地狱,提升代码可读性与维护性。
413 10
|
机器学习/深度学习 JavaScript 前端开发
JS进阶教程:递归函数原理与篇例解析
通过对这些代码示例的学习,我们已经了解了递归的原理以及递归在JS中的应用方法。递归虽然有着理论升华,但弄清它的核心思想并不难。举个随手可见的例子,火影鸣人做的影分身,你看到的都是同一个鸣人,但他们的行为却能在全局产生影响,这不就是递归吗?雾里看花,透过其间你或许已经深入了递归的魅力之中。
445 19
|
编解码 JavaScript 前端开发
【Java进阶】详解JavaScript的BOM(浏览器对象模型)
总的来说,BOM提供了一种方式来与浏览器进行交互。通过BOM,你可以操作窗口、获取URL、操作历史、访问HTML文档、获取浏览器信息和屏幕信息等。虽然BOM并没有正式的标准,但大多数现代浏览器都实现了相似的功能,因此,你可以放心地在你的JavaScript代码中使用BOM。
407 23
|
SQL JavaScript 安全
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
667 11
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
|
JavaScript
JS实现多条件搜索函数
JS封装的多条件搜索
|
JavaScript 前端开发
JavaWeb JavaScript ③ JS的流程控制和函数
通过本文的详细介绍,您可以深入理解JavaScript的流程控制和函数的使用,进而编写出高效、可维护的代码。
329 32
|
JSON 前端开发 JavaScript
在 JavaScript 中,如何使用 Promise 处理异步操作?
通过以上方式,可以使用Promise来有效地处理各种异步操作,使异步代码更加清晰、易读和易于维护,避免了回调地狱的问题,提高了代码的质量和可维护性。
|
JSON 前端开发 JavaScript
JavaScript中对象的数据拷贝
本文介绍了JavaScript中对象数据拷贝的问题及解决方案。作者首先解释了对象赋值时地址共享导致的值同步变化现象,随后提供了五种解决方法:手动复制、`Object.assign`、扩展运算符、`JSON.stringify`与`JSON.parse`组合以及自定义深拷贝函数。每种方法都有其适用场景和局限性,文章最后鼓励读者关注作者以获取更多前端知识分享。
310 1
JavaScript中对象的数据拷贝

热门文章

最新文章