结论:

相同点:

1、都是js原生方法,改变函数中的this指向

2、都可以传递参数,第一个参数为 把this指向到哪里去,即目标元素

不同点:

1、call和apply都是主动触发,绑定后自动执行,bind为手动绑定,不自动执行。

2、call和apply在传递参数的方式上有所不同,call为直接传参,apply的参数需要放在数组中

代码:

<script type="text/javascript">
var person = {name:'小明'}
person.say = function(){
console.log(this.name+'给范冰打了一晚上电话')
} person.say(); var person2 = {name:'阿华'}
person.say.call(person2) //把this指向改为person2,且主动执行了say方法,apply方法用法一样 </script>

传参时:

<script type="text/javascript">
var person = {name:'小明'}
person.say = function(tar,time){
console.log(this.name+'给'+tar+'打了'+time+'电话')
} person.say('特朗普','1小时'); var penson2 = {name:'阿华'}
person.say.call(penson2,'奥巴马','2小时') //call传递参数时,直接传参
//person.say.apply(penson2,['奥巴马','2小时']) //apply传递参数时,用数组传参 </script>

bind用法:

<script type="text/javascript">
var person = {name:'小明'}
person.say = function(tar,time){
setTimeout(function(){
console.log(this.name)
}.bind(person), 1000) //手动在函数后面绑定this指向,1秒后打印小明
}
person.say()
</script>

如此,打完收工!

原生js中call、apply、bind的区别和相同点的更多相关文章

  1. js 中call,apply,bind的区别

    call.apply.bind方法的共同点与区别: apply.call.bind 三者都是用来改变函数的this对象的指向: apply.call.bind 三者都可以利用后续参数传参: bind ...

  2. JS中call,apply,bind的区别

    1.关于this对象的指向,请看如下代码 var name = 'jack'; var age = 18; var obj = { name:'mary', objAge:this.age, myFu ...

  3. 原生js中slice()方法和splice()区别

    slice()方法和splice()方法都是原生js中对数组操作的方法. slice(),返回一个新的数组,该方法可从已有的数组中返回选定的元素.例如:arrObject(start,end),sta ...

  4. 原生JS实现call,apply,bind函数

    1. 前言 使用原生JS实现call和apply函数,充分了解其内部原理.call和apply都是为了解决改变this的指向.作用都相同,只是传参的方式不同.除了第一个参数外,call可以接受一个参数 ...

  5. JS中call,apply,bind方法的总结

    why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user: "小马扎", fn: ...

  6. 原生JS中apply()方法的一个值得注意的用法

    今天在学习vue.js的render时,遇到需要重复构造多个同类型对象的问题,在这里发现原生JS中apply()方法的一个特殊的用法: var ary = Array.apply(null, { &q ...

  7. 深入理解js中的apply、call、bind

    概述 js中的apply,call都是为了改变某个函数运行时的上下文环境而存在的,即改变函数内部的this指向. apply() apply 方法传入两个参数:一个是作为函数上下文的对象,另外一个是作 ...

  8. JS 的 call apply bind 方法

    js的call apply bind 方法都很常见,目的都是为了改变某个方法的执行环境(context) call call([thisObj[,arg1[, arg2[,   [,.argN]]]] ...

  9. javascript中call,apply,bind的用法对比分析

    这篇文章主要给大家对比分析了javascript中call,apply,bind三个函数的用法,非常的详细,这里推荐给小伙伴们.   关于call,apply,bind这三个函数的用法,是学习java ...

  10. JS 中的require 和 import 区别整理

    ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...

随机推荐

  1. 【原生JS】动态分页样式效果

    效果图如下: html: <body> <div> <table id="btnbox"> <tbody> <tr>&l ...

  2. element-ui css 文件加载 失败(https://unpkg.com/element-ui/lib/theme-chalk/index.css,加载失败)

    在main.js文件引入   import Vue from 'vue'; import Element from 'element-ui'; import 'element-ui/lib/theme ...

  3. Java Annotation详解(一): 理解和使用Annotation

    JDK1.5之后,引入了元数据的概念,也就是Annotation(注释),其实它是代码里的特殊标记,这些标记可以再编译.类加载.运行时被读取,并执行相应的处理. 元数据的作用: 如果要对于元数据的作用 ...

  4. Python--day67--内容回顾

  5. java什么是方法(Method)?

    方法是一组为了实现特定功能的代码块的集合.方法在语法上的功能主要有以下两个: ①:结构化代码 将代码按照功能进行组织,使代码的结构比较清晰,容易阅读和修改,也就是程序的可维护性强. ②:减少代码重复 ...

  6. vscode编辑如何保存时自动校准eslint规范

    在日常开发中,一个大点的项目会有多人参与,那么可能就会出现大家的代码风格不一,各显神通,这个时候就要祭出我们的eslint. 在这之前磨刀不误砍柴工,我们先来配置一下我们的代码编辑工具,如何在vsco ...

  7. 2019-8-31-AutoHotKey-用打码的快捷键

    title author date CreateTime categories AutoHotKey 用打码的快捷键 lindexi 2019-08-31 16:55:58 +0800 2019-06 ...

  8. H3C端口角色的确定

  9. linux vmalloc 和 其友

    我们展示给你的下一个内存分配函数是 vmlloc, 它在虚拟内存空间分配一块连续的内存 区. 尽管这些页在物理内存中不连续 (使用一个单独的对 alloc_page 的调用来获得每个 页), 内核看它 ...

  10. Linux 内核kobject 层次, kset, 和子系统

    kobject 结构常常用来连接对象到一个层级的结构中, 匹配正被建模的子系统的结构. 有 2 个分开的机制对于这个连接: parent 指针和 ksets. 在结构 kobject 中的 paren ...