JavaScript-funktionsparametrar


Innehållsförteckning

    Visa innehållsförteckning


En JavaScript funktion utför ingen kontroll parametervärden (argument).


Funktionsparametrar och argument

Tidigare i den här handledningen lärde du dig att funktioner kan ha parametrar:

function functionName(parameter1, parameter2, parameter3) {
    // code to be executed
}

Funktions parametrar är namnen som anges i funktionsdefinitionen.

Funktions argument är de verkliga värdena skickas till (och tas emot av) funktionen.


Parameterregler

JavaScript-funktionsdefinitioner anger inte datatyper för parametrar.

JavaScript-funktioner utför inte typkontroll av godkända argument.

JavaScript-funktioner kontrollerar inte antalet mottagna argument.


Standardparametrar

Om en funktion anropas med saknade argument (mindre än deklarerat) sätts de saknade värdena till odefinierad.

Ibland är detta acceptabelt, men ibland är det bättre att tilldela en standard värde till parametern:

Exempel

function myFunction(x, y) {
    if (y === undefined) {
    y = 2;
     }

}

Prova själv →

<!DOCTYPE html>
<html>
<body>

<p>Setting a default value to a function parameter.</p>
<p id="demo"></p>

<script>
function myFunction(x, y) {
  if (y === undefined) {
    y = 2;
  }  
  return x * y;
}
document.getElementById("demo").innerHTML = myFunction(4);
</script>

</body>
</html>



Standardparametervärden

ES6 tillåter funktionsparametrar att ha standardvärden.

Exempel

Om y inte är godkänt eller odefinierat är y=10.

function myFunction(x, y = 10) {	  return x + y;
}
myFunction(5);

Prova själv →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Functions</h1>
<h2>Default Parameter Values</h2>
<p>If y is not passed or undefined, then y = 10:</p>

<p id="demo"></p>

<script>
function myFunction(x, y = 10) {
  return x + y;
}
document.getElementById("demo").innerHTML = myFunction(5);
</script>

</body>
</html>

Funktion Vila Parameter

Parametern rest (...) tillåter en funktion att behandla ett obestämt antal argument som en array:

Exempel

function sum(...args) {
  let sum = 0;
  for (let arg of args) sum += arg;
  return sum;
}

let x = sum(4, 9, 16, 25, 29, 100, 66, 77);

Prova själv →

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Functions</h1>
<h2>The Rest Parameter</h2>

<p>The rest parameter (...) allows a function to treat an indefinite number of arguments as an array:</p>

<p id="demo"></p>

<script>
function sum(...args) {
  let sum = 0;
  for (let arg of args) sum += arg;
  return sum;
}

let x = sum(4, 9, 16, 25, 29, 100, 66, 77);

document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>


Argumentobjektet

JavaScript-funktioner har ett inbyggt objekt som kallas argumenten objekt.

Argumentobjektet innehåller en array av de argument som används när funktionen kallades (anropades).

På så sätt kan du helt enkelt använda en funktion för att hitta (till exempel) den högsta värde i en lista med siffror:

Exempel

x = findMax(1, 123, 500, 115, 44, 88);
function findMax() {
  let max = -Infinity;
    for (let i = 0; i < arguments.length; i++) {
      if (arguments[i] > max) {
      max = arguments[i];
      }
    }
    return max;
}

Prova själv →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Functions</h2>
<p>Finding the largest number.</p>
<p id="demo"></p>

<script>
function findMax() {
  let max = -Infinity;
  for(let i = 0; i < arguments.length; i++) {
    if (arguments[i] > max) {
      max = arguments[i];
    }
  }
  return max;
} 
document.getElementById("demo").innerHTML = findMax(4, 5, 6);
</script>

</body>
</html>


Eller skapa en funktion för att summera alla indatavärden:

Exempel

x = sumAll(1, 123, 500, 115, 44, 88);

function sumAll() {
  let sum = 0;
    for (let i = 0; i < arguments.length; i++) {
    sum += arguments[i];
    }
    return sum;
}

Prova själv →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Functions</h2>
<p>Sum of all arguments:</p>
<p id="demo"></p>

<script>
function sumAll() {
  let sum = 0;
  for(let i = 0; i < arguments.length; i++) {
    sum += arguments[i];
  }
  return sum;
}
document.getElementById("demo").innerHTML = sumAll(1, 123, 500, 115, 44, 88);
</script>

</body>
</html>

Om en funktion anropas med för många argument (fler än deklarerat), dessa argument kan nås med argumentobjektet.


Argument passeras av värde

Parametrarna i ett funktionsanrop är funktionens argument.

JavaScript-argument skickas av värde: Endast funktionen lär känna värdena, inte argumentets platser.

Om en funktion ändrar ett arguments värde, ändrar den inte parameterns ursprungligt värde.

Ändringar av argument är inte synliga (reflekteras) utanför funktionen.


Objekt skickas med referens

I JavaScript är objektreferenser värden.

På grund av detta kommer objekt att bete sig som om de passeras av referens:

Om en funktion ändrar en objektegenskap ändrar den det ursprungliga värdet.

Ändringar av objektegenskaper är synliga (reflekteras) utanför funktionen.