JavaScript 함수 호출 및 매개변수 전달 사용 예에 ​​대한 자세한 설명

JavaScript 함수 호출

각 메소드의 차이점은 이를 초기화한다는 점입니다.

값으로 매개변수 전달
함수에서 호출되는 매개변수는 함수의 매개변수입니다. 함수가 매개변수 값을 수정하는 경우 매개변수의 초기 값(함수 외부에서 정의됨)은 수정되지 않습니다. 함수 매개변수를 변경해도 함수 외부 변수(지역 변수)에는 영향을 미치지 않습니다.
객체를 통한 매개변수 전달
JavaScript에서는 객체의 값을 참조할 수 있습니다. 따라서 함수 내부에서 객체의 속성을 수정하면 객체의 초기값도 수정됩니다. 객체 속성 수정은 함수(전역 변수) 외부에서 수행될 수 있습니다.

이 키워드

일반적으로 Javascript에서는 함수가 실행될 때 현재 개체를 가리킵니다. 참고 이것은 예약된 키워드이므로 이 값을 수정할 수 없습니다.

JavaScript 함수 호출

함수 내부의 코드는 함수가 호출된 후에 실행됩니다.

함수로 호출됨

인스턴스

function myFunction(a, b) {
  return a * b;
}
myFunction(10, 2);      // myFunction(10, 2) 返回 20

위 함수는 어떤 객체에도 속하지 않습니다. 그러나 JavaScript에서는 항상 기본 전역 개체입니다. HTML의 기본 전역 개체는 HTML 페이지 자체이므로 함수는 HTML 페이지에 속합니다. 브라우저의 페이지 개체는 브라우저 창(창 개체)입니다. 위의 함수는 자동으로 창 개체의 함수가 됩니다. myFunction() 및 window.myFunction()은 동일합니다.

function myFunction(a, b) {
  return a * b;
}
window.myFunction(10, 2);  // window.myFunction(10, 2) 返回 20

참고 이는 JavaScript 함수를 호출하는 일반적인 방법이지만 좋은 프로그래밍 방식은 아닙니다. 메서드나 함수로 인해 이름 지정 충돌 버그가 쉽게 발생할 수 있습니다.
전역 객체
자체 객체에서 함수를 호출하지 않는 경우 this의 값이 전역 객체가 됩니다. 웹 브라우저에서 전역 개체는 브라우저 창(창 개체)입니다. 이 인스턴스에서 반환된 this 값은 창 개체입니다.

function myFunction() {
  return this;
}
myFunction();        // 返回 window 对象

참고: 함수를 전역 개체로 호출하면 이 값이 전역 개체가 됩니다. 창 개체를 변수로 사용하면 프로그램이 쉽게 중단될 수 있습니다.

메소드로 함수 호출

JavaScript에서는 함수를 객체의 메소드로 정의할 수 있습니다. 다음 예에서는 두 개의 속성(firstName 및 lastName)과 메서드(fullName)가 있는 개체(myObject)를 만듭니다.

var myObject = {
  firstName:"John",
  lastName: "Doe",
  fullName: function () {
    return this.firstName + " " + this.lastName;
  }
}
myObject.fullName();     // 返回 "John Doe"

fullName 메서드는 함수입니다. 함수는 객체에 속합니다. myObject는 함수의 소유자입니다. 이 개체에는 JavaScript 코드가 포함되어 있습니다. 인스턴스에서 이 값은 myObject 개체입니다. 아래에서 테스트해보세요! fullName 메서드를 수정하고 다음 값을 반환합니다.

var myObject = {
  firstName:"John",
  lastName: "Doe",
  fullName: function () {
    return this;
  }
}
myObject.fullName();     // 返回 [object Object] (所有者对象)

참고 함수가 개체 메서드로 호출되면 this 값이 개체 자체가 됩니다.

생성자를 사용하여 함수 호출

함수 호출 전에 new 키워드를 사용하면 생성자가 호출됩니다. 새 함수가 생성된 것처럼 보이지만 실제로는 JavaScript 함수가 객체를 다시 생성한 것입니다.

// 构造函数:
function myFunction(arg1, arg2) {
  this.firstName = arg1;
  this.lastName = arg2;
}

// This creates a new object
var x = new myFunction("John","Doe");
x.firstName;               // 返回 "John"

생성자를 호출하면 새 객체가 생성됩니다. 새 객체는 생성자의 속성과 메서드를 상속합니다. 참고 생성자의 this 키워드에는 값이 없습니다. this의 값은 함수가 호출될 때 객체(새 객체)가 인스턴스화될 때 생성됩니다.

함수를 함수 메서드로 호출

JavaScript에서 함수는 객체입니다. JavaScript 함수에는 속성과 메서드가 있습니다. call() 및 apply()는 미리 정의된 함수 메서드입니다. 두 가지 메서드를 사용하여 함수를 호출할 수 있으며, 두 메서드 모두의 첫 번째 매개 변수는 개체 자체여야 합니다.

function myFunction(a, b) {
  return a * b;
}
myFunction.call(myObject, 10, 2);   // 返回 20

Instance

function myFunction(a, b) {
  return a * b;
}
myArray = [10,2];
myFunction.apply(myObject, myArray);  // 返回 20

두 메서드 모두 개체 자체를 첫 번째 매개 변수로 사용합니다. 둘 사이의 차이점은 두 번째 매개변수에 있습니다. Apply는 매개변수 배열로 전달됩니다. 즉, 여러 매개변수가 하나의 배열로 결합되어 전달되는 반면, call은 호출의 매개변수로 전달됩니다(두 번째 매개변수부터 시작).
JavaScript 엄격 모드에서는 매개변수가 객체가 아니더라도 함수를 호출할 때 첫 번째 매개변수가 this의 값이 됩니다.
JavaScript 비엄격 모드(비엄격 모드)에서는 첫 번째 매개변수의 값이 null이거나 정의되지 않은 경우 대신 전역 개체를 사용합니다.
참고 call() 또는 apply() 메소드를 통해 이 값을 설정하고 기존 객체의 새 메소드로 호출할 수 있습니다.

JavaScript 함수 매개변수

JavaScript 함수는 매개변수(인수) 값에 대해 어떠한 검사도 수행하지 않습니다. 함수의 명시적 매개변수와 숨겨진 매개변수(인수)이전 튜토리얼에서 함수의 명시적 매개변수에 대해 배웠습니다.

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

함수의 명시적 매개변수는 함수가 정의될 ​​때 나열됩니다. 함수 숨겨진 매개변수(인수)는 함수 호출 시 함수에 전달되는 실제 값입니다.

参数规则
JavaScript 函数定义时参数没有指定数据类型。
JavaScript 函数对隐藏参数(arguments)没有进行检测。
JavaScript 函数对隐藏参数(arguments)的个数没有进行检测。
默认参数
如果函数在调用时缺少参数，参数会默认设置为： undefined

有时这是可以接受的，但是建议最好为参数设置一个默认值：

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

或者，更简单的方式：

function myFunction(x, y) {
  y = y || 0;
}

Note 如果y已经定义 ， y || 返回 y, 因为 y 是 true, 否则返回 0, 因为 undefined 为 false。如果函数调用时设置了过多的参数，参数将无法被引用，因为无法找到对应的参数名。 只能使用 arguments 对象来调用。

Arguments 对象
JavaScript 函数有个内置的对象 arguments 对象.argument 对象包含了函数调用的参数数组。通过这种方式你可以很方便的找到最后一个参数的值：

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

function findMax() {
  var i, max = 0;
  for (i = 0; i < arguments.length; i++) {
    if (arguments[i] > max) {
      max = arguments[i];
    }
  }
  return max;
}

或者创建一个函数用来统计所有数值的和：

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

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

위 내용은 JavaScript 함수 호출 및 매개변수 전달 사용 예에 ​​대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!