首页 > 编程语言 >JavaScript的原型、原型链、异步与单线程复习回顾

JavaScript的原型、原型链、异步与单线程复习回顾

时间:2023-02-13 15:23:32浏览次数:42  
标签:__ Object proto 单线程 JavaScript 原型 prototype

 原型和原型链

有对象的地方就有 原型,每个对象都会在其内部初始化一个属性,就是prototype(原型),原型中存储共享的属性和方法。当我们访问一个对象的属性时,js引擎会先看当前对象中是否有这个属性,如果没有的就会查找他的prototype对象是否有这个属性,如此递推下去,一直检索到 Object 内建对象。这么一个寻找的过程就形成了 原型链 的概念。

理解原型最关键的是理清楚__proto__、prototype、constructor三者的关系,我们先看看几个概念:

  • __proto__属性在所有对象中都存在,指向其构造函数的prototype对象;prototype对象只存在(构造)函数中,用于存储共享属性和方法;constructor属性只存在于(构造)函数的prototype中,指向(构造)函数本身。
  • 一个对象或者构造函数中的隐式原型__proto__的属性值指向其构造函数的显式原型 prototype 属性值,关系表示为:instance.__proto__ === instance.constructor.prototype
  • 除了 Object,所有对象或构造函数的 prototype 均继承自 Object.prototype,原型链的顶层指向 null:Object.prototype.__proto__ === null
  • Object.prototype 中也有 constructor:Object.prototype.constructor === Object
  • 构造函数创建的对象(Object、Function、Array、普通对象等)都是 Function 的实例,它们的 __proto__ 均指向 Function.prototype。

看起来是不是有点乱??别慌!!一张图帮你整理它们之间的关系

 

 相同的配方再来一刀

const arr = [1, 2, 3];
arr.__proto__ === Array.prototype; // true
arr.__proto__.__proto__ === Object.prototype; // true
Array.__proto__ === Function.prototype; // true

 异步和单线程

JavaScript 是 单线程 语言,意味着只有单独的一个调用栈,同一时间只能处理一个任务或一段代码。队列、堆、栈、事件循环构成了 js 的并发模型,事件循环 是 JavaScript 的执行机制。

为什么js是一门单线程语言呢?最初设计JS是用来在浏览器验证表单以及操控DOM元素,为了避免同一时间对同一个DOM元素进行操作从而导致不可预知的问题,JavaScript从一诞生就是单线程。

既然是单线程也就意味着不存在异步,只能自上而下执行,如果代码阻塞只能一直等下去,这样导致很差的用户体验,所以事件循环的出现让 js 拥有异步的能力。

 

 


标签:__,Object,proto,单线程,JavaScript,原型,prototype
From: https://www.cnblogs.com/caihongmin/p/17116492.html

相关文章

  • 提高代码质量的 11 个高级 JavaScript 函数
    通过使用包括Debounce、Once和Memoize的函数,以及Pipe、Pick和Zip,来提高代码质量!介绍JavaScript是一种强大而多功能的编程语言,具有许多内置特性,可以帮助您编写......
  • javascript表单提交的内容显示在表格中
    实现三个文本域的内容提交之后显示在表格中,代码直接用文本文件运行,记得后缀改为.html运行结果输入123,并点击提交按钮之后,数据就会显示在下面的表格中,有什么问题可以私聊我......
  • 【JavaScript】11_枚举属性+可变类型+修改对象和属性与方法
    4、枚举属性枚举属性,指将对象中的所有的属性全部获取for-in语句\-语法:for(letpropNamein对象){语句...}\-for-in的循环体会执行多次,有几个属性就会执行几次,每次执......
  • 从简单到复杂:深入了解 JavaScript 中的 this 绑定规则
    前言大家好,我是CoderBin,在JavaScript中,this是一个非常重要的概念,属于进阶知识,不管是在面试还是日常开发中都是非常常用的。所以本次给大家总结了关于this的绑定规则,来帮助......
  • 在 JavaScript 中实现原型模式的 2 种方法
    这种模式是JavaScript的核心,也是每个JS开发人员“必须具备”的知识。今天我们将看到一些关于如何实施和使用它的示例和建议。本文将包含JavaScript和TypeScript的示例。......
  • JavaScript 数组求差集
    letarr1=[1,2,3,4,5];letarr2=[4,5,6,7,8];//数组求差集functionarrayDiff(arr1,arr2){//先去重letarr1Unique=[...newSet(arr1)];letarr......
  • 回顾 JavaScript
    回顾JavaScript阅读前建议了解ECMAScript是什么?不然你可能会疑惑下面内容JavaScript中掺杂的ECMAScript需要大体了解过JavaScript主要是对JavaScript复习,温......
  • 8个 CSS & JavaScript 实现的照片库(相册)特效
    照片库(相册)是很多网站的必备功能,因为独特地呈现图像的能力可以帮助网站脱颖而出。网页开发者设计师正在利用这一优势,他们使用最新的CSS和JavaScript技术来创建抽象布局......
  • 原型 / 构造函数 / 实例
    原型(prototype):一个简单的对象,用于实现对象的属性继承。可以简单的理解成对象的爹。在Firefox和Chrome中,每个JavaScript对象中都包含一个_proto_(非标准)的属性指向它爹(该......
  • 前端知识案例8-javascript基础语法-基本数据类型
    ......