vue.js 数组里面有对象、数组_JavaScript之类数组对象与arguments

df338d030c5b6a7bb60d8ee435cb50cf.gif

阅读本文约需要5分钟

大家好,我是你们的导师,我每天都会给大家分享一些干货内容(当然了,周末也要允许老师休息一下哈)。上次给大家分享了JavaScript中new的模拟实现,今天给大家分享一下类数组对象与arguments。

类数组对象

所谓的类数组对象,就是拥有一个 length 属性和若干索引属性的对象。举个例子:

a5b07aca1903789119173d9650127260.png

即便如此,为什么叫做类数组对象呢?那让我们从读写、获取长度、遍历三个方面看看这两个对象。

1. 读写

25e45d71463369278f5fefcc4e9e629d.png

2. 长度

e590f94d49003ad6345fad968397aad5.png

3. 遍历

819d9e0fc034140947e03655c5270915.png

是不是很像?那类数组对象可以使用数组的方法吗?比如:arrayLike.push('4');

然而上述代码会报错: arrayLike.push is not a function,所以终归还是类数组呐……

4. 调用数组的方法

如果类数组就是任性的想用数组的方法怎么办呢?既然无法直接调用,我们可以用 Function.call 间接调用:

8e1258d8abbbc088bbaa125119202c26.png

5. 类数组转数组

在上面的例子中已经提到了一种类数组转数组的方法,再补充三个:

1e6844d726a60e04b7f6ac87a74468d9.png

那么为什么会讲到类数组对象呢?以及类数组有什么应用吗?要说到类数组对象,Arguments 对象就是一个类数组对象。在客户端 JavaScript 中,一些 DOM 方法(document.getElementsByTagName()等)也返回类数组对象。

Arguments对象

接下来重点讲讲 Arguments 对象。Arguments 对象只定义在函数体中,包括了函数的参数和其他属性。在函数体中,arguments 指代该函数的 Arguments 对象。举个例子:

8fbb7013907536a002f6de9928e6ebfb.png

打印结果如下:

622f1576b0720c09bd3554ba51ec1e53.png

我们可以看到除了类数组的索引属性和length属性之外,还有一个callee属性,接下来我们一个一个介绍。

1. length属性

Arguments对象的length属性,表示实参的长度,举个例子:

bf59c416aa9c7444288f5805b48451bf.png

2. calle属性

Arguments 对象的 callee 属性,通过它可以调用函数自身。讲个闭包经典面试题使用 callee 的解决方法:

02a922c9-b134-eb11-8da9-e4434bdf6706.png

接下来讲讲 arguments 对象的几个注意要点:

3. arguments 和对应参数的绑定

cca3d222262daab7944b0029b86c877b.png

传入的参数,实参和 arguments 的值会共享,当没有传入时,实参与 arguments 值不会共享。除此之外,以上是在非严格模式下,如果是在严格模式下,实参和 arguments 是不会共享的。

4. 传递参数

将参数从一个函数传递到另一个函数:

1dab4ccefcd70ed05e1d44938e96916b.png

5. 强大的ES6

使用ES6的 ... 运算符,我们可以轻松转成数组。

99fe4115664314fc9566e8519aad2a03.png

6. 应用

arguments的应用其实很多,在下个系列,也就是 JavaScript 专题系列中,我们会在 jQuery 的 extend 实现、函数柯里化、递归等场景看见 arguments 的身影。大家可以自己去看看,这篇文章就不具体展开了。

今天就分享到这,今日留言话题:JavaScript中类数组对象和arguments你了解多少?对于有价值的留言,我们都会一一回复的。如果觉得对你有一丢丢帮助,请点右下角【在看】,让更多人看到该文章。

39262b8edcee6bbdec61d6a6688ebe1b.gif

81702da69eb55fb9a0991d2c172d2570.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值