当前位置: 首页 > news >正文

js函数之call和apply

一、含义

function test() {
    console.log('----')
}

//执行
test();
test.call()

        结果一致,调用test()默认会调用call,二者效果一致,call省略掉了。

二、改变this指向

        call还有一个很重要的功能是改变this的指向。

function Car(brand, color) {
    this.brand = brand;
    this.color = color;
    this.run = function () {
        console.log('run 方法')
    }
}

let newCar = {
    age: 30
}

1、不用 call

console.log('newCar', newCar)

打印结果:{}

2、使用 call

//参数1:对象,参数2,3,4……:其他参数
Car.call(newCar, '兰博基尼', 'red')
console.log('newCar', newCar)

打印结果:

{
   "brand": "兰博基尼",
   "color": "red"
}

        可以看出改变了this 的指向,和apply的区别是后面是一个数组,其他没啥区别,均可以改变this 指向Car.apply(newCar, ['兰博基尼', 'red'])。

三、应用

function Compute() {
    this.plus = function (a, b) {
        console.log(a + b)
    }
    this.minus = function (a, b) {
        console.log(a - b)
    }
}

function FullCompute() {
    Compute.apply(this)
    this.mul = function (a, b) {
        console.log(a * b)
    }
    this.div = function (a, b) {
        console.log(a / b)
    }
}

const compute = new FullCompute();
compute.plus(1,1);
compute.minus(1,1);
compute.mul(1,1);
compute.div(1,1);

打印结果:

四、全局this和函数this

        全局定义的this和函数内部定义的 this 相当于 window,例如:

function test() {
    this.a = 1;
    let b = 2
}

test();
console.log(a); // 1
console.log(b); // b is not defined

相关文章:

  • stm32平衡小车(1)---蓝牙模块及其bug处理
  • [JavaEE]线程的状态与安全
  • 【Qt】事件处理——按键事件处理
  • opencv-python常用函数解析及参数介绍(八)——轮廓与轮廓特征
  • flutter项目编译问题汇总
  • C++关联容器(复习题篇)
  • 02SpringCloudAlibaba服务注册中心—Eureka
  • opencv-python常用函数解析及参数介绍(七)——边缘检测
  • 14---实现文件上传和下载(头像上传功能)
  • Vue2学习笔记(四):计算属性(computed)和监事属性(watch)
  • 《信号与系统实验》实验 4:连续离散时间信号与系统的复频域分析实验
  • 【算法】kmp、Trie、并查集、堆
  • 2022年终总结与展望
  • (黑马C++)L06 重载与继承
  • Docker常用命令 - 黑马学习笔记
  • “Material Design”设计规范在 ComponentOne For WinForm 的全新尝试!
  • 【腾讯Bugly干货分享】从0到1打造直播 App
  • Apache的基本使用
  • bearychat的java client
  • iOS 系统授权开发
  • JavaScript 一些 DOM 的知识点
  • JavaSE小实践1:Java爬取斗图网站的所有表情包
  • Java超时控制的实现
  • Java到底能干嘛?
  • leetcode46 Permutation 排列组合
  • php的插入排序,通过双层for循环
  • Vue源码解析(二)Vue的双向绑定讲解及实现
  • 多线程事务回滚
  • 理解在java “”i=i++;”所发生的事情
  • 利用DataURL技术在网页上显示图片
  • 七牛云假注销小指南
  • 前端技术周刊 2019-01-14:客户端存储
  • 前端路由实现-history
  • 前端学习笔记之观察者模式
  • zabbix3.2监控linux磁盘IO
  • ​​​​​​​ubuntu16.04 fastreid训练过程
  • ​比特币大跌的 2 个原因
  • ​插件化DPI在商用WIFI中的价值
  • ###STL(标准模板库)
  • #define用法
  • $NOIp2018$劝退记
  • (2020)Java后端开发----(面试题和笔试题)
  • (9)目标检测_SSD的原理
  • (aiohttp-asyncio-FFmpeg-Docker-SRS)实现异步摄像头转码服务器
  • (C#)Windows Shell 外壳编程系列9 - QueryInfo 扩展提示
  • (C语言版)链表(三)——实现双向链表创建、删除、插入、释放内存等简单操作...
  • (二)【Jmeter】专栏实战项目靶场drupal部署
  • (附源码)spring boot火车票售卖系统 毕业设计 211004
  • (附源码)springboot建达集团公司平台 毕业设计 141538
  • (附源码)ssm高校志愿者服务系统 毕业设计 011648
  • (已更新)关于Visual Studio 2019安装时VS installer无法下载文件,进度条为0,显示网络有问题的解决办法
  • (已解决)什么是vue导航守卫
  • .NET CORE 3.1 集成JWT鉴权和授权2
  • .NET Core、DNX、DNU、DNVM、MVC6学习资料
  • .NET Micro Framework 4.2 beta 源码探析