• 技术文章 >web前端 >js教程

    Javascript call和apply区别及使用方法

    高洛峰高洛峰2017-01-12 11:40:00原创481
    一、方法的定义
    call方法:
    语法:fun.call(thisArg[, arg1[, arg2[, ...]]])
    定义:调用一个对象的一个方法,以另一个对象替换当前对象。
    说明:
    call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisArg 指定的新对象。
    如果没有提供 thisArg参数,那么 Global 对象被用作 thisArg。

    apply方法:
    语法:fun.apply(thisArg[, argsArray])
    定义:应用某一对象的一个方法,用另一个对象替换当前对象。
    说明:
    如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
    如果没有提供 argArray 和 thisArg 任何一个参数,那么 Global 对象将被用作 thisArg, 并且无法被传递任何参数。

    二、两者区别
    两个方法基本区别在于传参不同
    2.1、call方法:

    function Product(name, price) {
    this.name = name;
    this.price = price;
    if (price < 0)
    throw RangeError('Cannot create product "' + name + '" with a negative price');
    return this;
    }
    function Food(name, price) {
    Product.call(this, name, price);
    this.category = 'food';
    }
    Food.prototype = new Product();
    function Toy(name, price) {
    Product.call(this, name, price);
    this.category = 'toy';
    }
    Toy.prototype = new Product();
    var cheese = new Food('feta', 5);
    var fun = new Toy('robot', 40);

    2.2、apply方法:

    function Product(name, price) {
    this.name = name;
    this.price = price;
    if (price < 0)
    throw RangeError('Cannot create product "' + name + '" with a negative price');
    return this;
    }
    function Food(name, price) {
    Product.apply(this, arguments);
    this.category = 'food';
    }
    Food.prototype = new Product();
    function Toy(name, price) {
    Product.apply(this, arguments);
    this.category = 'toy';
    }
    Toy.prototype = new Product();
    var cheese = new Food('feta', 5);
    var fun = new Toy('robot', 40);

    三、作用实例

    3.1、类的继承

    function Person(name,age){
    this.name = name;
    this.age=age;
    this.alertName = function(){
    alert(this.name);
    }
    this.alertAge = function(){
    alert(this.age);
    }
    }
    function webDever(name,age,sex){
    Person.call(this,name,age);
    this.sex=sex;
    this.alertSex = function(){
    alert(this.sex);
    }
    }
    var test= new webDever(“设计蜂巢”,24,”男”);
    test.alertName();//设计蜂巢
    test.alertAge();//24
    test.alertSex();//男

    3.2、回调函数

    function Album(id, title, owner_id) {
    this.id = id;
    this.name = title;
    this.owner_id = owner_id;
    };
    Album.prototype.get_owner = function (callback) {
    var self = this;
    $.get(‘/owners/' + this.owner_id, function (data) {
    callback && callback.call(self, data.name);
    });
    };
    var album = new Album(1, ‘设计蜂巢', 2);
    album.get_owner(function (owner) {
    alert(‘The album' + this.name + ‘ belongs to ‘ + owner);
    });

    更多Javascript call和apply区别及使用方法相关文章请关注PHP中文网!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:Javascript call apply
    上一篇:JavaScript学习点滴 call、apply的区别 下一篇:Vue.js每天必学之数据双向绑定
    VIP课程(WEB全栈开发)

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• 一文了解JavaScript栈• JavaScript字典与集合(总结分享)• 怎么利用node生成word文档?使用库分享• 深入理解JavaScript内存管理和GC算法• 怎么使用pkg将Node.js项目打包为可执行文件?
    1/1

    PHP中文网