>  기사  >  웹 프론트엔드  >  JavaScript 함수 정의, 호출 모드 및 초기화 예에 대한 자세한 설명

JavaScript 함수 정의, 호출 모드 및 초기화 예에 대한 자세한 설명

伊谢尔伦
伊谢尔伦원래의
2017-07-25 10:43:281998검색

함수 정의

함수에는 JavaScript의 기본 모듈 단위이며 코드 재사용, 정보 숨기기 및 결합 호출에 사용되는 일련의 명령문이 포함되어 있습니다. 함수는 객체의 동작을 지정하는 데 사용됩니다

함수의 네 가지 호출 모드와 this의 초기화

첫 번째: 메서드 호출 모드
다음 예는 메서드 호출 모드를 통해 호출할 때 this가 바인딩되어 있음을 증명합니다. 메소드를 소유한 객체입니다. 예:

var person = {
    name: "defaultName",
    setName : function(name){
        this.name = name;
    }
};
person.setName("zhangsan");
alert(person.name);

두 번째 유형: 함수 호출 모드
다음 예는 함수 호출 모드를 통해 호출할 때 이것이 전역 객체에 바인딩된다는 것을 증명합니다. 예:

var test = add(value1, value2);
var name = "defaultName";
var person = {
    name: "zhangsan", // person中定义的name
    getName : function(){
        // 通过此方法可以将test函数的this改变为person的this对象
        var that = this;  // 解决方案
        // getName中定义的name
        var name = "lisi";
        var test = function(){
            // 通过that来访问person中的对象
            // this指向Global对象
            // this.name = defaultName
            // that.name = zhangsan
            alert([this.name, that.name]);
        };
        test(); // 函数调用模式
    }
}
person.getName();

세 번째: 생성자 호출 모드

// 定义一个Person的构造器,在调用时一定要用new调用
var Person = function(name){
    this.name = name;
}
// 添加一个方法到Person
Person.prototype.getName = function(){
    return this.name;
};
// 构造一个Person对象
var person = new Person("zhangsan");
alert(person.getName()); // 调用getName获取person对象中name属性的值

네 번째: 적용 호출 모드

<script type="text/javascript">
    // 定一个累加方法。如sum(1,2,3,4...)
    // 该方法位于window执行环境中。
    var displayName = function(){
        alert("sum的执行环境: " + typeof(this));
        alert("Name: " + this.name); // 取出当前执行环境中name属性
    }
    // 定一个Person对象
    var Person = {
        name: "zhangsan"
    };
    displayName.apply(Person);
</script>

Apply와 call의 차이점

// 定一个对象,包含一个add方法,返回a、b的和
var Person = {
    &#39;add&#39; : function(a, b){
        return a + b;
    }
};
// 显示a、b的和
function showInfo(a, b){
    alert(this.add(a, b));
}
// 通过apply方法改变showInfo方法的this指向
//showInfo(1, 3); // 对象不支持次对象
showInfo.apply(Person, [1, 3]);
showInfo.call(Person, 1, 3);
// 从上面可以看出,apply和call的区别是apply接受一个数组作为被调函数的参数,
// 而call是通过将被调函数的所有参数以逗号分隔的形式展开

위 내용은 JavaScript 함수 정의, 호출 모드 및 초기화 예에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.