《前端面试题》- JS基础 - 伪数组

第一次听说伪数组这个概念,听到的时候还以为是说CSS的伪类呢,网上一查,这东西原来还是个很常见的家伙。

何为伪数组

伪数组有两个特点:

  1. 具有length属性,其他属性(索引)为非负整数
  2. 但是却不具备数组的方法
    也就是看起来像是数组,然而并不是…

举个例子看看

  1. 函数内部的arguments
function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(arguments[0]);console.log(arguments[1]);console.log(arguments[2]);
}
testArguments(1,2,3);

test result
2. DOM列表

  1. JQuery选择得出的列表: $(‘div’)
    随意找一个使用jq的网站,例如:https://www.jq22.com/

如何判断真伪数组

  1. 使用instanceof 方法
  2. 使用Array.isArray()方法: 未必准确,见下文, 使用伪数组.__proto__ = Array.prototype;转换后不可用。
  3. 伪数组.constructor === Array; 适用于带constructor的场景
  4. Object.prototype.toString.call(arr) === ‘[object Array]’

尝试一下:

function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(`arguments is array: ${arguments instanceof Array}`);console.log(`arguments is object: ${arguments instanceof Object}`);const newArguments = Array.prototype.slice.call(arguments);console.log(`newArguments is array: ${Array.isArray(newArguments)}`);console.log(`newArguments is array: ${newArguments instanceof Array}`);console.log(`newArguments is object: ${newArguments instanceof Object}`);
}testArguments(1,2,3);

如何把伪数组转换成数组

  1. Array.prototype.slice.call(); / Array.prototype.slice.apply();
  2. 原型继承: 伪数组.__proto__ = Array.prototype;arguments 无影响正常使用
  3. ES6中数组的新方法 from()
方法一: Array.prototype.slice.call(); / Array.prototype.slice.apply();
function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(arguments[0]);console.log(arguments[1]);console.log(arguments[2]);const newArguments = Array.prototype.slice.call(arguments);console.log(`newArguments is array: ${Array.isArray(newArguments)}`);console.log(newArguments[0]);console.log(newArguments[1]);console.log(newArguments[2]);
}
testArguments(1,2,3);

方法二: 原型继承: 伪数组.__proto__ = Array.prototype;arguments 无影响正常使用
使用该方法进行转换时,Array.isArray()方法不可用来进行判断。

方法三: ES6中数组的新方法 from()

尝试一下:

function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(`arguments is array: ${arguments instanceof Array}`);const newArguments = Array.from(arguments);console.log(`newArguments is array: ${Array.isArray(newArguments)}`);console.log(`newArguments is array: ${newArguments instanceof Array}`);
}
testArguments(1,2,3);

总结

  1. 在使用判断是否为数组时,如果无法知道数组是否可能是使用“原型继承”的方法转换得到的,就不要使用Array.isArray()方法判断对象是否为数组的方法。
  2. 在写转换方法时,由于原型继承: 伪数组.__proto__ = Array.prototype;可能存在判断失误,尽量使用Array.prototype.slice.call(); / Array.prototype.slice.apply();如果可以使用ES6,使用Array.from()方法较为简单明了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/817553.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C ++ 和 C语言的优缺点分别是什么?

C语言,它简直就是编程世界的一块磐石。简洁、直接,让人一眼就能明白它想干嘛。它的运行速度快,接近硬件操作,特别适合那些需要直接与硬件打交道的场景。但就是因为这种接近硬件的特性,C语言在抽象层次上就显得有点捉襟…

【MCU开发规范】:MCU的性能测试

MCU的性能测试 前序性能评判方法MIPSCoreMark EEMBC其他参考 前序 我们平时做MCU开发时,前期硬件选型(选那颗MCU)基本由硬件工程师和架构决定,到软件开发时只是被动的开发一些具体功能,因此很少参与MCU的选型。 大部分…

Harbor Deployment (Helm)

文章目录 Harbor Deployment (Helm)前期准备创建stl证书 Harbor 部署推送镜像 Harbor Deployment (Helm) Helm 部署 Harbor需要使用共享存储,docker-compose 部署使用单台宿主机存储。 前期准备 创建stl证书 # 模拟域名,公司可以申请内部域名 # VIP bi…

linux(ub)-redis环境部署

1.下载redis包 wget http://download.redis.io/releases/redis-7.0.5.tar.gz 2.解压缩: tar -zxvf redis-7.0.5.tar.gz 3.安装gcc:sudo apt-get install gcc 4. 编译:cd redis-7.0.5 make make make install 5. cd /usr/local/bin/ 6. mkdir …

spring xml 集成Redission集群

1、引入redission <jackson-databind.version>2.8.2</jackson-databind.version><jackson-core.version>2.8.2</jackson-core.version><dependency><groupId>org.redisson</groupId><artifactId>redisson</artifactId>&…

财务软件有哪些优势?

提高准确性 财务软件可以提高会计做账的准确性&#xff0c;相对于人工计算的繁琐复杂&#xff0c;软件通过程序计算&#xff0c;可以大大降低出错率。而且财务软件有很多自动化功能&#xff0c;财务软件有结账自动结转损益、银行现金不能为负数等等功能、年末自动结转本年利润等…

SSL证书和IP证书的区别

SSL证书是一种用于保障网络传输安全的数字证书&#xff0c;它通过为网站提供加密服务&#xff0c;确保用户与网站之间交换的数据不被第三方截取或篡改。IP证书是一种用于验证和保护IP地址的数字证书。它是通过将IP地址与其所有者的身份信息相联系&#xff0c;从而确保IP地址的真…

哪种裤子比较百搭?显高显瘦的男生裤子分享

选到合适的裤子才能穿得好看以及舒服。可是市面上也出现了不少各种裤子质量达不到标准的负面新闻&#xff0c;为了能够选到合适的裤子&#xff0c;我自费购买了多个品牌的裤子测评。之后我知道很多网红品牌为了压低成本&#xff0c;用料和做工都很差&#xff0c;于是我总结了五…

Springboot框架入门介绍——1.快速搭建启动程序框架

如果使用过spring可能会为繁琐复杂的配置项感到头疼&#xff0c;而springboot内嵌了tomcat和jetty容器&#xff0c;简化了maven配置&#xff0c;基于注解的0配置思想&#xff0c;同时可以和各种其他框架无缝整合&#xff0c;实现快速开发spring应用框架。 这里需要记住一句话&a…

ssl证书怎么部署,有免费的吗?

SSL&#xff08;Secure Sockets Layer&#xff09;证书&#xff0c;也就是安全套接字层证书&#xff0c;为网络通信提供安全及数据完整性保障&#xff0c;成为了在线交易和数据传输不可或缺的一部分。那么&#xff0c;SSL证书如何部署&#xff1f;又是否有免费的选择呢&#xf…

JavaEE之锁策略,cas 和 synchronized 优化过程深入浅出

目录 题外话 正题 锁策略 乐观锁和悲观锁 轻量锁和重量锁 CAS算法(Compare And Swap) 自旋锁和挂起等待锁 普通互斥锁和读写锁 公平锁和非公平锁 可重入锁和不可重入锁 synchronized原理 基本特点 锁升级 其它锁优化 锁消除 锁粗化 小结 题外话 时间紧任务重,直…

软考高项论文评分规则,快快收藏!

给大家梳理了一些关于高项论文评分的准则&#xff0c;虽然不是官方版&#xff0c;但是只要此刻正在阅读的你能达到其中的标准&#xff0c;那基本论文也就达到了考试要求的标准了。 一、论文评分细则一 论文满分是75分&#xff0c;论文评分可分为优良、及格与不及格3个档次。评…

基于Django(python+sql)的校园二手交易系统设计与实现(完整程序+开题报告+论文)

随着互联网的迅猛发展&#xff0c;校园内的二手交易市场也逐渐呈现出蓬勃的发展态势。学生们在校园生活中会产生大量的闲置物品&#xff0c;而其他学生也有可能需要这些物品。本论文研究了校园二手交易系统的需求分析、系统实现和测试三个部分&#xff0c;旨在提高校园二手交易…

Java——类和对象

目录 一.类定义和使用 1.简单认识类 2.类的定义格式 3.注意事项 二.课堂练习 1.定义一个狗类 2.定义一个学生类 3.注意事项&#xff1a; 三.类的实例化 1.什么是实例化 2.注意事项 3.类和对象的说明 四.this引用 1.为什么要有this引用 2.什么是this引用 五.对…

数据库同步服务-DatalinkX

数据库同步服务-DatalinkX 项目特性 简单易用&#xff1a;通过Web页面快速创建数据源、同步任务&#xff0c;操作简单&#xff0c;一分钟上手定时触发&#xff1a;对接xxl-job定时&#xff0c;设置cron表达式触发同步任务配置化任务对接&#xff1a;将数据库信息、任务详情界…

从零开始学习Linux(1)---基本命令(1)

1.学习准备 我学习Linux是使用xshell远程登录自己的云服务器来进行。 xshell是一个远程终端管理软件&#xff0c;下载官网&#xff1a; https://www.netsarang.com/products/xsh_overview.htm 下载安装的时候选择 "home/school"…

简单逆向案例,某留言板载荷参数逆向

网址&#xff1a;aHR0cHM6Ly9saXV5YW4ucGVvcGxlLmNvbS5jbi90aHJlYWRzL2xpc3Q/Y2hlY2tTdGF0dXM9MCZmaWQ9NTYzJmZvcm1OYW1lPSVFNyVBNiU4RiVFNSVCQiVCQSVFNyU5QyU4MSVFNSVBNyU5NCVFNCVCOSVBNiVFOCVBRSVCMCVFNSU5MSVBOCVFNyVBNSU5NiVFNyVCRiVCQyZwb3NpdGlvbj0wJnByb3ZpbmNlPTIwJmNp…

理解计算中的随机性与伪随机性:Avi Wigderson的理论计算科学贡献

目录 前言1 随机性和伪随机性在计算中的角色2 随机性的动态理解3 伪随机性的应用4 理论到实践的应用结语 前言 近期&#xff0c;普林斯顿大学数学教授Avi Wigderson荣获了2023年图灵奖&#xff0c;以表彰他在理论计算机科学领域的杰出贡献。他的研究聚焦于计算复杂性理论&…

HuggingFists-如何复用流程(二)

上一篇文章中&#xff0c;我们介绍了如何在HuggingFists系统中复用流程。如何定义流程,接收外部数据流以及写出数据流。通过接收和写出数据流实现流程的嵌套引用。在实际的应用场景中&#xff0c;被引用的子流程除了需要与主流程的数据流进行交互外&#xff0c;有时其流程内部的…

鸿蒙端云一体化开发--调用云函数--适合小白体制

如何实现在端侧调用云函数&#xff1f; 观看前&#xff0c;友情提示&#xff1a; 不知道《如何一键创建端云一体化模板》的小白同学&#xff0c;请看&#xff1a; 鸿蒙端云一体化开发--开发云函数--适合小白体制-CSDN博客 实现方法&#xff1a; 第一步&#xff1a;添加依赖 …