前端面试之JavaScript中this的指向【待完善!】
JavaScript中this的指向问题!
另一个特殊的对象是 this,它在标准函数和箭头函数中有不同的行为。
在标准函数中, this 引用的是把函数当成方法调用的上下文对象,这时候通常称其为 this 值(在网页的全局上下文中调用函数时, this 指向 windows)。来看下面的例子:
window.color = 'red';
let person = {
name: 'lvhang',
age: 23,
color: 'pink'
}
function sayColor() {
console.log(this.color);
}
function sayColor2() {
console.log(this.color === window.color);
}
sayColor(); // red
sayColor2(); // true
person.sayColor = sayColor;
person.sayColor(); // pink
定义在全局上下文中的函数 sayColor()引用了 this 对象。这个 this 到底引用哪个对象必须到函数被调用时才能确定。
因此这个值在代码执行的过程中可能会变。
如果在全局上下文中调用sayColor(),这结果会输出"red",因为 this 指向 window,而 this.color 相当于 window.color。
而在把 sayColor()赋值给 person 之后再调用 person.sayColor(), this 会指向 person,即 this.color 相当于
person.color,所以会显示"blue"。
在构造函数中this 指向的是我们的对象实例
function Singer(name, gender) {
this.name = name;
this.age = age;
}
var xiaoshi = new Singer('小时姑娘!');
// 1 在构造函数中, 里面的this指向的是对象实例 xiaoshi
2 原型对象里面的this指向的是谁呢?!
// 只有你调用的时候才能确定指向的是谁!
var that;
Singer.prototype.sing = function() {
console.log('我唱歌很好听, 你听听看!');
that = this;
}
var xiaoshi = new Singer('小时姑娘!');
// 一般情况下this指向的是我们的调用者!
// 也就是我们的对象实例!xiaoshi
前端面试之JavaScript中this的指向【待完善!】的更多相关文章
- 前端面试之JavaScript中数组的方法!【残缺版!!】
前端面试之JavaScript中数组常用的方法 7 join Array.join()方法将数组中所有元素都转化为字符串并连接在-起,返回最后生成的字 符串.可以指定一个可选的字符串在生成的字符串中来 ...
- 前端面试之JavaScript中的闭包!
前端面试之JavaScript中的闭包! 闭包 闭包( closure )指有权访问另一个函数作用域中变量的函数. ----- JavaScript 高级程序设计 闭包其实可以理解为是一个函数 简单理 ...
- javascript中this的指向
作为一个前端小白在开发中对于this的指向问题有时候总是会模糊,于是花时间研究了一番. 首先this是JS的关键字,this是js函数在运行是生成的一个内部对象,生成的这个this只能在函数内部使用. ...
- 前端面试之ES6中的继承!
前端面试之ES6中的继承! ES6之前并没有给我们提供 extends继承.我们可以通过构造函数+原型对象模拟实现继承,被称为组合继承. 1 call() 两个作用: 1 调用这个函数! 2 修改函数 ...
- 前端开发:Javascript中的数组,常用方法解析
前端开发:Javascript中的数组,常用方法解析 前言 Array是Javascript构成的一个重要的部分,它可以用来存储字符串.对象.函数.Number,它是非常强大的.因此深入了解Array ...
- Javascript中的this指向。
一.JavaScript中的函数 在了解this指向之前,要先弄明白函数执行时它的执行环境是如何创建的,这样可以更清楚的去理解JavaScript中的this指向. function fn(x,y,n ...
- JavaScript中 this 的指向
很多人都会被JavaScript中this的指向(也就是函数在调用时的调用上下文)弄晕,这里做一下总结: 首先,顶层的this指向全局对象. 函数中的this按照调用方法的不同,其指向也不同: 1.函 ...
- 前端面试之JavaScript的基本数据类型!
前端面试之JavaScript的基本数据类型! JS的基本数据类型 数字 字符串 布尔值 JavaScript中有两个特殊的原始值: null (空) 和undefined (未定义), , 它们不是 ...
- 面试题-浅谈JavaScript中的This指向问题
各位小伙伴在面试中被面试官问道this指向问题一定不少吧,同时还被问道apply,call和bind的用法区别,现在,就来简单的聊一聊this到底指向何方. 1.基本概念 MDN的官方解释:与其他语言 ...
随机推荐
- 不一样的资产安全 3D 可视化平台
前言 数字经济时代,应用好数据是企业数字化转型的关键,基于前沿科学技术进行数据的有效管控,更是对数字增值服务的新趋势.近年来,整个安全行业对资产管理的重视程度正在提高.据IDC发布的相关数据显示, ...
- Redis入门指导
前言 本文提供全网最完整的Redis入门指导教程,下面我们从下载Redis安装包开始,一步一步的学习使用. 下载Redis 官网提供的Redis安装包是服务于Linux的,而我们需要在Window下使 ...
- H3C路由器配置——动态路由RIP协议
一.静态路由的不足 静态路由适用于:小规模的网络.架构不怎么调整的网络.没有环路的网络 二.RIP协议工作过程 2.1.工作特点 n路由信息协议RIP(Routing Information Prot ...
- 技术基础 | 用JSON在抖音上发布动态——使用Stargate即可轻松实现
Cassandra是世界上经受住最多实战考验的数据库,通过其快速且易于使用的数据API,让你的程序开发升级. 本文将介绍什么是Stargate以及Stargate的最新进展,如果您想快速浏览相关代码和 ...
- Python-对比参考目录查找多个文件夹中不同的文件
改完文件名称后,Dr.he 发现分别保存5个状态的jpg 文件的文件夹出现缺少文件的情况.为了让他少熬夜查找缺失文件,结合网友分享的脚本,写了查找以下代码,满足他的需求,也以防自己忘记.以下代码能解决 ...
- [leetcode]Q133Clone Graph
克隆图记住:一个map一个queue,照葫芦画瓢BFS 找到一个节点就画一个对应的新的,用map对应,然后添加邻居,记录邻居到queue public UndirectedGraphNode clon ...
- 编写通用的Makefile
一个应用程序的形成是少不了一下几个步骤的. 1. 预处理 #检查语法错误.包含头文件.展开#if.#define等宏定义 2. 编译 #把.c文件转换为汇编文件.s 3. 汇编 #把.s汇编转换为机器 ...
- 微信小程序-页面下拉
微信小程序当滑动到最顶部和最底部时,继续下拉,会将整个页面拉下去或者拉上去,本来以为是客户端自有的特性,就没去管他,直到我的禅道出现了这个记录... 其实这个问题是可以解决的,只需要在你不想出现在此情 ...
- Python输出HelloWorld(以及环境配置)
java usebean 用法: https://blog.csdn.net/zhang150114/article/details/89434617
- Lightweight Render Pipeline
(翻译) Lightweight Render Pipeline (LWRP),轻量级渲染管线,是一个Unity预制的Scriptable Render Pipeline (SRP).LWRP可以为移 ...