【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

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

相关文章
|
9月前
|
前端开发 JavaScript API
JavaScript异步编程:从Promise到async/await
JavaScript异步编程:从Promise到async/await
678 204
|
7月前
|
前端开发 JavaScript API
js实现promise常用场景使用示例
本文介绍JavaScript中Promise的6种常用场景:异步请求、定时器封装、并行执行、竞速操作、任务队列及与async/await结合使用,通过实用示例展示如何优雅处理异步逻辑,避免回调地狱,提升代码可读性与维护性。
383 10
|
11月前
|
机器学习/深度学习 JavaScript 前端开发
JS进阶教程:递归函数原理与篇例解析
通过对这些代码示例的学习,我们已经了解了递归的原理以及递归在JS中的应用方法。递归虽然有着理论升华,但弄清它的核心思想并不难。举个随手可见的例子,火影鸣人做的影分身,你看到的都是同一个鸣人,但他们的行为却能在全局产生影响,这不就是递归吗?雾里看花,透过其间你或许已经深入了递归的魅力之中。
413 19
|
编解码 JavaScript 前端开发
【Java进阶】详解JavaScript的BOM(浏览器对象模型)
总的来说,BOM提供了一种方式来与浏览器进行交互。通过BOM,你可以操作窗口、获取URL、操作历史、访问HTML文档、获取浏览器信息和屏幕信息等。虽然BOM并没有正式的标准,但大多数现代浏览器都实现了相似的功能,因此,你可以放心地在你的JavaScript代码中使用BOM。
372 23
|
前端开发 JavaScript Java
【Java进阶】JavaScript电灯开关实例:从理论到实践
这个例子展示了JavaScript的基本功能,包括操作HTML元素,监听事件,以及改变元素的样式。通过学习和理解这个例子,你可以了解到JavaScript在网页中的应用,以及如何使用JavaScript来创建交互式的网页。
234 13
|
JavaScript
JS实现多条件搜索函数
JS封装的多条件搜索
|
SQL JavaScript 安全
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
628 11
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
|
JavaScript 前端开发
JavaWeb JavaScript ③ JS的流程控制和函数
通过本文的详细介绍,您可以深入理解JavaScript的流程控制和函数的使用,进而编写出高效、可维护的代码。
301 32
|
JavaScript 前端开发 Java
详解js柯里化原理及用法,探究柯里化在Redux Selector 的场景模拟、构建复杂的数据流管道、优化深度嵌套函数中的精妙应用
柯里化是一种强大的函数式编程技术,它通过将函数分解为单参数形式,实现了灵活性与可复用性的统一。无论是参数复用、延迟执行,还是函数组合,柯里化都为现代编程提供了极大的便利。 从 Redux 的选择器优化到复杂的数据流处理,再到深度嵌套的函数优化,柯里化在实际开发中展现出了非凡的价值。如果你希望编写更简洁、更优雅的代码,柯里化无疑是一个值得深入学习和实践的工具。从简单的实现到复杂的应用,希望这篇博客能为你揭开柯里化的奥秘,助力你的开发之旅! 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一