JavaScript之arguments

miqt 发布于2019-08-23 12:29 / 2567人阅读

摘要：三的属性属性表示传入函数的实际参数数量，而不是函数声明时的形参数量。你好你好你好你好你好你好扩展运算符你好你好五严格模式严格模式和非严格模式中，的表现显示不相同。而在严格模式中，实参和的值不会共享。

本文共 635 字，读完只需 3 分钟

概述

JavaScript中的函数与其他面向对象语言有几个不同的地方。

没有函数重载

有一个表示实参列表的类数组对象 arguments

一、函数重载

简单来说，JAVA 同一个类中允许几个函数有同样的函数名称，但是参数声明不一样，这就是函数重载。

但是 JS 不支持函数重载：

function foo(num) {
    console.log(num + 100)
}

function foo(num) {
    console.log(num + 200)
}

foo(100);  // 300

如果 js 中定义了两个相同名称的函数，那么该名字只属于后定义的那个函数。

二、arguments 类数组

函数 arguments 对象是所有（非箭头）函数中都可用的局部变量, 是一个类似数组的对象。你可以使用arguments对象在函数中引用函数的（实际）参数。

function foo() {
    console.log(arguments);
}

foo(1, "foo", false, {name: "bar"}); // [1, "foo", false, object]

function foo() {
    console.log(typeof arguments);
}

foo(1, "foo", false, {name: "bar"}); // object

所以，arguments 是一个具有数组样式的对象，有 length 属性，和下标来索引元素。

三、arguments 的属性

length

function foo(num1, num2, num3) {
    console.log(arguments)
}

foo(1);  // [1]

length 属性表示传入函数的实际参数数量，而不是函数声明时的形参数量。

callee
callee 表示函数本身，我们可以在函数中通过 callee 调用本身。

四、转化为真数组

slice

arguments 对象不支持数组的其他方法，但是可以用 Function.call 来间接调用。

function sayHi() {
    console.log(Array.prototype.slice.call(arguments, 0))
}
sayHi("hello", "你好", "bonjour")  //["hello", "你好", "bonjour"]

splice

function sayHi() {
    console.log(Array.prototype.splice.call(arguments, 0));
}
sayHi("hello", "你好", "bonjour")  //["hello", "你好", "bonjour"]

Array.from

function sayHi() {
    console.log(Array.from(arguments));
}
sayHi("hello", "你好", "bonjour")  //["hello", "你好", "bonjour"]

扩展运算符

function sayHi(...arguments) {
    console.log(arguments);
}
sayHi("hello", "你好", "bonjour")  //["hello", "你好", "bonjour"]

五、严格模式

严格模式和非严格模式中，arguments 的表现显示不相同。

// 严格模式
function foo(a, b) {
    "use strict";
    console.log(a, arguments[0]);
    a = 10;
    console.log(a, arguments[0]);
    arguments[0] = 20;
    console.log(a, arguments[0]);
    b = 30;
    console.log(b, arguments[1])
}
foo(1);
输出：
1 1
10 1
10 20
30 undefined

// 非严格模式
function foo(a, b) {
    console.log(a, arguments[0]);
    a = 10;
    console.log(a, arguments[0]);
    arguments[0] = 20;
    console.log(a, arguments[0]);
    b = 30;
    console.log(b, arguments[1]);
}
foo(1);
输出：
1 1
10 10
20 20
30 undefined

在非严格模式中，传入的参数，实参和 arguments 的值会共享，当没有传入时，实参与 arguments 值不会共享。

而在严格模式中，实参和 arguments 的值不会共享。

欢迎关注我的个人公众号“谢南波”，专注分享原创文章。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/98599.html

JavaScript深入之new的模拟实现

摘要：深入系列第十二篇，通过的模拟实现，带大家揭开使用获得构造函数实例的真相一句话介绍运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型之一也许有点难懂，我们在模拟之前，先看看实现了哪些功能。 JavaScript深入系列第十二篇，通过new的模拟实现，带大家揭开使用new获得构造函数实例的真相 new 一句话介绍 new: new 运算符创建一个用户定义的对象类型的实例或具...

tianlai 2019-08-20 16:17 评论0 收藏0
JavaScript深入之bind的模拟实现

摘要：也就是说当返回的函数作为构造函数的时候，时指定的值会失效，但传入的参数依然生效。构造函数效果的优化实现但是在这个写法中，我们直接将，我们直接修改的时候，也会直接修改函数的。 JavaScript深入系列第十一篇，通过bind函数的模拟实现，带大家真正了解bind的特性 bind 一句话介绍 bind: bind() 方法会创建一个新函数。当这个新函数被调用时，bind() 的第一个参数...

FingerLiu 2019-08-20 16:15 评论0 收藏0
JavaScript之模拟函数重载

摘要：背景高级程序设计中提及，不支持函数重载。若出现函数名称相同情况下，后者覆盖前者，故此不会出现重载的情况。维基百科场景例如，一个工厂有着数量级的员工，期望通过姓名找到某一员工或某类员工，使用同一个方法通过透传参数个数去查找员工。背景《JavaScript高级程序设计》中提及，JavaScript 不支持函数重载。若出现函数名称相同情况下，后者覆盖前者，故此不会出现重载...

chenjiang3 2019-08-26 10:46 评论0 收藏0
JavaScript进阶之模拟new Object过程

摘要：后续我将推出进阶系列，一方面是一个监督自己学习的一个过程，另一方面也会给看到的童鞋一些启发。第二步链接到原型中现在把构造函数和参数都打印出来了。原文：https://zhehuaxuan.github.io/... 作者：zhehuaxuan 写在前面的话前端的入门相对简单，相对于其他方向天花板可能会相对较低。但是在市场上一个优秀的前端依旧是很抢手的。能够站在金字塔上的人往往寥寥...

chengtao1633 2019-08-23 15:55 评论0 收藏0
【进阶1-2期】JavaScript深入之执行上下文栈和变量对象

摘要：本计划一共期，每期重点攻克一个面试重难点，如果你还不了解本进阶计划，点击查看前端进阶的破冰之旅本期推荐文章深入之执行上下文栈和深入之变量对象，由于微信不能访问外链，点击阅读原文就可以啦。（关注福利，关注本公众号回复[资料]领取优质前端视频，包括Vue、React、Node源码和实战、面试指导）本周正式开始前端进阶的第一期，本周的主题是调用堆栈，今天是第二天。本计划一共28期，每期...

Richard_Gao 2019-08-23 13:46 评论0 收藏0