Heim > Web-Frontend > Front-End-Fragen und Antworten > Unterstützt Javascript Parameter variabler Länge?

Unterstützt Javascript Parameter variabler Länge?

青灯夜游
Freigeben: 2022-09-30 16:47:37
Original
2260 Leute haben es durchsucht

Javascript unterstützt Parameter variabler Länge. Zwei Methoden zum Implementieren von Parametern variabler Länge: 1. Verwenden Sie das Argumentobjekt. Die Länge des Argumentobjekts wird durch die Anzahl der tatsächlichen Parameter und nicht durch die Anzahl der formalen Parameter bestimmt ​​sind synchronisiert, aber für einen der Nullfälle wird der Wert für diesen Nullfall nicht synchronisiert. 2. Restparameter bedeutet, redundante Parameter zu akzeptieren und in ein Array einzufügen. Die Syntax lautet „...Variablenname“.

Unterstützt Javascript Parameter variabler Länge?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

Javascript unterstützt Parameter variabler Länge.

Implementierung von JS-Parametern variabler Länge (Variablenparameter) 1: Argumente

Was sind Argumente? Wie implementiert man variable Parameter?

arguments ist ein Array-ähnliches Objekt, das den an die Funktion übergebenen Argumenten entspricht.

In ES5 können Sie das Argumentobjekt verwenden, um variable Parameter zu implementieren.

Die Länge des Argumentobjekts wird durch die Anzahl der tatsächlichen Parameter und nicht durch die Anzahl der formalen Parameter bestimmt. Formale Parameter sind Variablen, die im Speicherbereich innerhalb der Funktion erneut geöffnet werden, sich jedoch nicht mit dem Speicherbereich des Argumentobjekts überschneiden. Wenn sowohl Argumente als auch Werte vorhanden sind, werden die beiden Werte synchronisiert. Wenn jedoch einer von ihnen keinen Wert hat, wird der Wert in diesem wertlosen Fall nicht synchronisiert.

<script>
function dynamicArgs() {
	var info = "今日签到的学生有:";
	for (let i = 0; i < arguments.length ; i ++) {
		if (i > 0) {
			info += ",";
		}
		info += arguments[i];
	}
	
	console.log(info);
}

dynamicArgs("张三", "李四");
dynamicArgs("张三", "李四", "王五", "马六");
dynamicArgs(["张三", "李四", "王五", "马六", "jack", "rose"]);
</script>
Nach dem Login kopieren
<ul style="list-style-type: disc;"><li>

Die Parameter sind nicht sicher, also schreiben Sie sie einfach nicht auf.

  • Sie können beim Aufruf N mehrere Parameter schreiben oder ein Array direkt übergeben.

  • Ausführungseffekt:

    Unterstützt Javascript Parameter variabler Länge?

    Zusammenfassung:

    1. Wie aus der Funktionsdefinition hervorgeht, besteht keine Notwendigkeit, formale Parameter zu schreiben, wenn in der Funktion variable Parameterargumente verwendet werden

    2. Beim Aufruf der Funktion können mehrere tatsächliche Parameter direkt an die Funktion übergeben werden.

    Argumentobjekte sind lokale Variablen, die in allen (Nicht-Pfeil-)Funktionen verfügbar sind. Sie können das Arguments-Objekt verwenden, um auf die Argumente einer Funktion innerhalb einer Funktion zu verweisen. Dieses Objekt enthält jeden an die Funktion übergebenen Parameter, wobei der erste Parameter den Index 0 hat. Wenn einer Funktion beispielsweise drei Argumente übergeben werden, können Sie diese wie folgt referenzieren:

    arguments[0]
    arguments[1]
    arguments[2]
    Nach dem Login kopieren

    Parameter können auch festgelegt werden:

    arguments[0] = &#39;value&#39;;
    Nach dem Login kopieren

    argumentsarguments 是一个对象,不是一个 Array 。它类似于Array ,但除了length属性和索引元素之外没有任何Array 属性。例如,它没有 pop 方法。但是它可以被转换为一个真正的Array

    所以经常能看到这样的代码:

    // 由于arguments不是 Array,所以无法使用 Array 的方法,所以通过这种方法转换为数组
     
    var args = [].slice.call(arguments);  // 方式一
    var args = Array.prototype.slice.call(arguments); // 方式二
     
    // 下面是 es6 提供的语法
    let args = Array.from(arguments)   // 方式一
    let args = [...arguments]; // 方式二
    Nach dem Login kopieren

    arguments<span style="font-size: 16px;">上的属性</span>

    • arguments.callee:指向当前执行的函数(在 严格模式 下,第5版 ECMAScript (ES5) 禁止使用 a<strong>rguments.callee()</strong>
    • argunments.length:指向传递给当前函数的参数数量
    • arguments.caller:已移除

    arguments与剩余参数、默认参数和解构赋值参数的结合使用

    1)在严格模式下,剩余参数、默认参数和解构赋值参数的存在不会改变 arguments对象的行为,但是在非严格模式下就有所不同了

    function func(a) { 
      arguments[0] = 99;   // 更新了arguments[0] 同样更新了a
      console.log(a);
    }
    func(10); // 99
    
    // 并且
    
    function func(a) { 
      a = 99;              // 更新了a 同样更新了arguments[0] 
      console.log(arguments[0]);
    }
    func(10); // 99
    Nach dem Login kopieren

    2)当非严格模式中的函数没有包含剩余参数、默认参数和解构赋值,那么arguments对象中的值跟踪参数的值(反之亦然)。看下面的代码:

    function func(a = 55) { 
      arguments[0] = 99; // updating arguments[0] does not also update a
      console.log(a);
    }
    func(10); // 10
    
    //
    
    function func(a = 55) { 
      a = 99; // updating a does not also update arguments[0]
      console.log(arguments[0]);
    }
    func(10); // 10
    
    
    function func(a = 55) { 
      console.log(arguments[0]);
    }
    func(); // undefined
    Nach dem Login kopieren

    JS不定长参数(可变参数)的实现一:rest 参数(...)

    在ES6标准中引入了 rest 参数(形式为…变量名 is an object,</code > code> ist kein <code>Array. Es ähnelt Array, verfügt jedoch über keine Array-Attribute außer dem Längenattribut und dem Indexelement. Beispielsweise gibt es keine Pop-Methode. Aber es kann in ein echtes Array konvertiert werden:

    So sieht man oft Code wie diesen:

    function f(a, b, ...theArgs) {
      // ...
    }
    Nach dem Login kopieren

    arguments

    Attributes on <ul style="list-style-type: disc;"><li>

      arguments.callee: Verweist auf die aktuell ausgeführte Funktion (im strikten Modus verbietet Version 5 von ECMAScript (
    ES5

    ) die Verwendung von a<span style="color: rgb(255, 0, 0);">rguments.callee()</span>)argunments. Länge: Zeigt auf die Anzahl der an die aktuelle Funktion übergebenen Argumente

    arguments.caller: Entfernte Unterstützt Javascript Parameter variabler Länge?

    Argumente kombiniert mit verbleibenden Parametern, Standardparametern und zerstörten Zuweisungsparametern

    🎜🎜🎜1) Im strikten Modus verbleibend Die Existenz von Parametern, Standardparametern und zerstörten Zuweisungsparametern ändern das Verhalten von arguments-Objekten nicht, es wird jedoch im nicht-strikten Modus anders sein🎜
    function f(arg1, ...rest, arg2) { // arg2 after ...rest ?!
      // error
    }
    Nach dem Login kopieren
    🎜2) Bei Funktionen im nicht-strikten Modus🎜Nein 🎜 Enthält verbleibende Parameter, Standardparameter und zerstörte Zuweisungen, dann verfolgt der Wert im arguments-Objekt 🎜 🎜 den Wert des Parameters (und umgekehrt). Schauen Sie sich den folgenden Code an: 🎜
    //以前函数
    function f(a, b) {
      var args = Array.prototype.slice.call(arguments, f.length);
     
      // …
    }
     
    // 等效于现在
     
    function f(a, b, ...args) {
      
    }
    Nach dem Login kopieren
    Nach dem Login kopieren

    🎜 Implementierung 1 von JS-Parametern variabler Länge (variable Parameter): Restparameter (...) 🎜🎜

    🎜Die Restparameter (in der Form ...Variablenname), der zum Abrufen der zusätzlichen Parameter der Funktion verwendet wird. Die mit dem restlichen Parameter übereinstimmende Variable ist ein Array, das die redundanten Parameter in das Array einfügt. Sehr gut geeignet für den Umgang mit Parametern variabler Länge. 🎜🎜Rest soll das Problem der Inkonsistenz in der Anzahl der übergebenen Parameter lösen. Dies bedeutet, dass die zusätzlichen Parameter akzeptiert und in ein Array eingefügt werden. Der Rest-Parameter selbst ist ein Array, und alle Array-bezogenen Methoden können verwendet werden. 🎜🎜🎜 Implementierungssyntax variabler Parameter: 🎜🎜
    function f(...[a, b, c]) {
      return a + b + c;
    }
     
    f(1)          //NaN 因为只传递一个值,其实需要三个值
    f(1, 2, 3)    // 6
    f(1, 2, 3, 4) // 6 (第四值没有与之对应的变量名)
    Nach dem Login kopieren
    Nach dem Login kopieren
    🎜🎜🎜theArgs beginnt mit „…“, es ist ein Array, sein Wert kommt vom tatsächlichen Aufrufer, der [0,theArgs.length) übergibt (indizierter Bereich: 0 zu theArgs.length-1)🎜🎜🎜🎜🎜Hinweis🎜🎜: ​​Nach dem 🎜rest-Parameter dürfen keine weiteren Parameter stehen (d. h. es kann nur der letzte Parameter sein), andernfalls wird ein Fehler gemeldet. 🎜
    function sumAll(...args) { // args 是数组的名称
      let sum = 0;
     
      for (let arg of args) sum += arg;
     
      return sum;
    }
     
    console.log( sumAll(1) ); // 1
    console.log( sumAll(1, 2) ); // 3
    console.log( sumAll(1, 2, 3) ); // 6
    Nach dem Login kopieren
    Nach dem Login kopieren
    🎜🎜🎜🎜🎜Unterscheiden Sie zwischen Restparametern und Parameterobjekten (Argumenten)🎜🎜<ul style="list-style-type: disc;"><li>

    rest参数不会为每个变量给一个单独的名称,参数对象包含所有参数传递给函数

  • 参数对象不是真正的数组,rest参数是真实的数组实例。例如数组sort、map、forEach、pop的方法都可以直接使用

  • 参数对象有他自己额外的特性(例如callee 属性)

  • Rest参数的引入减少样式代码

    //以前函数
    function f(a, b) {
      var args = Array.prototype.slice.call(arguments, f.length);
     
      // …
    }
     
    // 等效于现在
     
    function f(a, b, ...args) {
      
    }
    Nach dem Login kopieren
    Nach dem Login kopieren

    Rest参数可以被解构(通俗一点,将rest参数的数据解析后一一对应)不要忘记参数用[] 括起来,因为它数组嘛

    function f(...[a, b, c]) {
      return a + b + c;
    }
     
    f(1)          //NaN 因为只传递一个值,其实需要三个值
    f(1, 2, 3)    // 6
    f(1, 2, 3, 4) // 6 (第四值没有与之对应的变量名)
    Nach dem Login kopieren
    Nach dem Login kopieren

    示例

    1、计算参数和

    function sumAll(...args) { // args 是数组的名称
      let sum = 0;
     
      for (let arg of args) sum += arg;
     
      return sum;
    }
     
    console.log( sumAll(1) ); // 1
    console.log( sumAll(1, 2) ); // 3
    console.log( sumAll(1, 2, 3) ); // 6
    Nach dem Login kopieren
    Nach dem Login kopieren

    Unterstützt Javascript Parameter variabler Länge?

    2、每个参数乘以2

    function multiply(multiplier, ...theArgs) {
      return theArgs.map(function(element) {
        return multiplier * element;
      });
    }
     
    var arr = multiply(2, 1, 2, 3); 
    console.log(arr); // [2, 4, 6]
    Nach dem Login kopieren

    Unterstützt Javascript Parameter variabler Länge?

    3、排序

    function sortRestArgs(...theArgs) {
      var sortedArgs = theArgs.sort();
      return sortedArgs;
    }
    //好像一位和两位混合不能进行排序,这需要看一下为甚?主要第一个为主
    console.log(sortRestArgs(5, 3, 7, 1)); // shows 1, 3, 5, 7
    Nach dem Login kopieren

    Unterstützt Javascript Parameter variabler Länge?

    对比:参数对象arguments不能排序

    function sortArguments() {
      //arguments是参数对象不能直接使用sort()方法,因为不是数组实例,需要转换
      var sortedArgs = arguments.sort(); 
      return sortedArgs; // this will never happen
    }
     
    // 会抛出类型异常,arguments.sort不是函数
    console.log(sortArguments(5, 3, 7, 1));
    Nach dem Login kopieren

    Unterstützt Javascript Parameter variabler Länge?

    【相关推荐:javascript学习教程 、编程视频

    Das obige ist der detaillierte Inhalt vonUnterstützt Javascript Parameter variabler Länge?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

    Verwandte Etiketten:
    Quelle:php.cn
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage