this的指向问题 call apply bind 中的this
在函数中this指向谁: 函数中的this指向谁,是由函数被调用的那一刻就确定下来的
// 想要判断函数中的this指向谁,遵循两条原则:
// 1. 我们要判断的this在哪个函数中
// 2. 这个函数是哪种调用模式调用的 function fn(){
console.log(this);
} // 普通函数调用: this --> window
fn(); //对象调用 this -->obj
var obj = {};
obj.f = fn;
obj.f(); //this -->obj // new 调用函数 this --> 新创建出来的实例对象
var f = new fn(); // 注册事件 this --> box
box.onclick = fn; // 定时器 this --> window
setInterval(fn,1000); //fn内部底层是被浏览器调用的所以也指window
function fn(x, y){
console.log(this);
console.log(x + y);
}
var f = fn.bind({a:1}); //fn中的this 永久绑定{a: 1} ；f是新克隆出来的函数
console.log(f); //输出 一个新的函数
/*
输出结果 ƒ fn(x, y){
console.log(this);
console.log(x + y);
}
*/
f(1,2); // {a: 1} 3
案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!-- 当我们需要批量创建对象的时候，需要用到构造函数，构造函数如何继承？ -->
<!-- 借用构造函数法继承 -->
<!-- student里面的name age不想在重复的书写了 -->
<script>
function Person (name,age){//03 'zh'，18
this.name=name; // a.name='zh'
this.age=age; // a.age=18
} function Student (name,age,score){//('zh',18,100)
Person.call(this,name,age);//02 this指向a， Person.call()调用了函数,并将参数'zh'，18传入
this.score=score; } var a=new Student('zh',18,100) //01 new Student()会调用Student构造函数，并且将构造函数中的this指向new出来的新对象a,
console.log(a) //还会把参数('zh',18,100)传入 构造函数中 // new的作用
// 创建一片空的储存空间
// 让子对象继承父对象
// 调用构造函数，并将构造函数中的this 指向new新对象
// 返回新对象的地址给变量 </script>
</body>
</html>
this的指向问题 call apply bind 中的this的更多相关文章
- this指向与call,apply,bind
this指向与call,apply,bind ❝ 「this」问题对于每个前端同学来说相信都不陌生,在平时开发中也经常能碰到,有时候因为「this」还踩过不少坑,并且「this」问题在面试题中出现的概 ...
- JavaScript中call,apply,bind方法的总结。
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- JavaScript中call,apply,bind方法的总结
原文链接:http://www.cnblogs.com/pssp/p/5215621.html why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之 ...
- JS中call,apply,bind方法的总结
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user: "小马扎", fn: ...
- js 中arguments，call,apply,bind的使用
//对于 arguments和this, 每个函数都有自己独有的arguments和this, 且不进行链式查找 //arguments是什么? //答:1:arguments是收到的实参副本 //2 ...
- JavaScript中call,apply,bind方法的区别
call,apply,bind方法一般用来指定this的环境. var a = { user:"hahaha", fn:function(){ console.log(this.u ...
- javascript中的call(),apply(),bind()方法的区别
之前一直迷惑,记不住call(),apply(),bind()的区别.不知道如何使用,一直处于懵懂的状态.直到有一天面试被问到了这三个方法的区别,所以觉得很有必要总结一下. 如果有不全面的地方,后续再 ...
- js中的call,apply,bind区别
在JavaScript中,call.apply和bind是Function对象自带的三个方法,这三个方法的主要作用是改变函数中的this指向. call.apply.bind方法的共同点和区别:app ...
- JavaScript中call,apply,bind方法
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
随机推荐
- spring+mybatis+log4j 输出SQL
1.在mybatis-config.xml配置中添加setting配置参数,会打印SQL执行结果 <?xml version="1.0" encoding="UTF ...
- CSS3 Animations
CSS Animations 是CSS的一个模块,它定义了如何用关键帧来随时间推移对CSS属性的值进行动画处理.关键帧动画的行为可以通过指定它们的持续时间,它们的重复次数以及它们如何重复来控制. an ...
- thinkphp 系统变量
一.查看可用变量 dump($_SERVER); 可以直接在html输出系统变量的值 <p>{$Think.server.HTTP_HOST}</p>. 二.环境变量 1.查看 ...
- VUE的系统指令
1. -text原样渲染,渲染文本 2.-html HTML渲染页面 举例: <!doctype html> <html lang="en"> < ...
- 【HDOJ6627】equation（模拟）
题意:给定n,整数序列a和b,整数C,求所有成立的x n<=1e5,1<=a[i]<=1e3,-1e3<=b[i]<=1e3,1<=C<=1e9 思路: 大概 ...
- 解决Windows2003 Server终端服务120天限制
用过windows server 2003做服务器的人都知道,windows2003的性能安全性比以前的windows版本高出很多,但是也带来很多麻烦.其中服务器最重要的远程管理“终端服务”居然要求授 ...
- 牛客提高D3t1 破碎的矩阵
分析 我们发现如果行的异或和等于列的异或和那么对于n-1行m-1列的所有数的选择都是任意的 因为一定可以在它的行末/列末选一个合适的数是的整体满足 但是我们发现对于右下角那一个数是否满足存疑 我们设矩 ...
- ImportError: libsybdb.so.5: cannot open shared object file: No such file or directory pymssql linux 问题解决 搭建驱动
[root@hadoop1 nlp]# python sqlserver_t.py Traceback (most recent call last): File "sqlserver_t ...
- Android O编译前修改文件和目录权限
当需要修改某文件或路径权限时,我们可以在init.rc开机启动某节点添加chmod命令进行修改.但是对于system分区,由于是ro权限,在init.rc使用chmod修改权限无效.需要在文件编译时, ...
- leetcode 141. 环形链表（C++）
给定一个链表,判断链表中是否有环. 为了表示给定链表中的环,我们使用整数 pos 来表示链表尾连接到链表中的位置(索引从 0 开始). 如果 pos 是 -1,则在该链表中没有环. 示例 1: 输入: ...