面试题--this关键字

this 指向是前端面试中的常问题型,简单分析为以下几种:

1. 在全局作用域中,this 关键字固定指向全局对象 window 或者 global。

2. 在函数作用域中,取决于函数是如何被调用的。

        1)函数直接调用,this 指向全局对象。

        2)通过一个对象的属性调用,格式为对象.属性()对象["属性"](),this指向该对象。

3. 使用构造函数创建对象时,构造函数中的 this 代表着 new 的对象。

4. 使用 call、apply、bind 绑定时,this 指向绑定的对象。

5. 箭头函数中 this 等于其定义环境中的 this,并且箭头函数一经创建,this 不能被任何方法改变。

对于 this 指向问题,不能仅仅了解理论知识,还需要实际应用,下面是一些常见的面试题。

面试题一:

console.log(this); 
function demo() {console.log(this);
}
demo(); let a = demo;
let array = [a, demo];
array[0]();
array[1](); let obj = {a,demo
};
obj.a();
obj.demo(); // 答案
// window 
// window
// 数组里,值调用,此时 this 指向数组,返回值是数组[],下面对象同理
// [ƒ, ƒ]
// [ƒ, ƒ]
// {a: ƒ, demo: ƒ}
// {a: ƒ, demo: ƒ}

结论一:this 在调用时才会知道指代的对象是谁,也就是说:谁调用函数,this 就指向谁,没有调用时候,this 指向未知。

面试题二:

const obj1 = {a: function () {console.log(this);},b: {x: 123,func: function () {console.log(this);}}
}
obj1.a();
obj1.b.func();
const temp = obj1.a;
temp();// 答案
// {b: {…}, a: ƒ} 
// {x: 123, func: ƒ}
// window

结论二:如果将函数重新赋值一个新的变量,执行时指向 window,此时是函数直接被调用。

面试题三:

const obj = {firstName: 'sun',lastName: 'flower',age: 1,sayHello: function() {console.log(`My name is ${this.firstName}${this.lastName},and I am ${this.age} years old`);}
}
obj.sayHello(); const a = obj.sayHello;
a();// 答案
// My name is sunflower,and I am 1 years old
// My name is undefinedundefined,and I am undefined years old
// 此时 a 里面只保存函数,而没有函数内部的值,因此均为 undefined。
let obj = {firstName: 'sun',lastName: 'flower',age: 1,sayHello: function() {console.log(`My name is ${obj.firstName}${obj.lastName},and I am ${obj.age} years old`);}
}
let b = obj;
obj = 123;
b.sayHello(); // 答案
// My name is undefinedundefined,and I am undefined years old

结论三:在对象内使用 this 最常见,this 指向当前被调用的对象,会实时改变,可以避免赋值导致的问题。

面试题四:

var obj = {fun1: function() {console.log(this);return function() {return this;};}
}
console.log(obj.fun1()());// 答案
// obj对象本身:{fun1: ƒ}
// window

首先 obj.fun1() 调用后,返回 function(){ return this } 函数,该函数再次调用时与 obj 没有关系,所以返回 window。注意是二次调用,有两次输出,结果不同。

以上就是常见关于 this 指向的问题,有需要的小伙伴可以仔细研究一下,对面试很有帮助哦。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/20885.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Leetcode 3169. Count Days Without Meetings

Leetcode 3169. Count Days Without Meetings 1. 解题思路2. 代码实现 题目链接:3169. Count Days Without Meetings 1. 解题思路 这一题的话我们只需要先对meeting的时间进行一下排序,然后不断更新当前连续开会的时间即可。当某一个会议开始时&#…

Java中lambda表达式是啥怎么使用

在Java中,Lambda表达式(也称为闭包)是一种简洁地表示匿名函数(即没有名称的函数)的方式。它们允许你将函数作为参数传递或赋值给变量,从而简化代码。Lambda表达式在Java 8及更高版本中引入。 Lambda表达式…

打造智能化未来:智能运维系统架构解析与应用实践

在数字化转型的大背景下,智能运维系统成为了企业提升效率、降低成本、增强安全性的关键利器。本文将深入探讨智能运维系统的技术架构,介绍其核心要素和应用实践,帮助读者全面了解智能运维系统的概念、优势和应用价值。 ### 1. 智能运维系统的…

如何进入 -MGMTDB目录

想想这个问题,大家可能觉得很简单吧,先不看答案,你试一试如何进去 1.问题现象: 我直接进入: cd -MGMTDB 直接就报错了: [gridhost03 _mgmtdb]$ cd -MGMTDB -bash: cd: -M: invalid option cd: usage: c…

Rust struct

Rust struct 1.实例化需要初始化全部成员变量2.如果需要实例化对象可变,加上mut则所有成员变量均可变 Rust支持通过已实例化的对象,赋值给未赋值的对象的成员变量 #![allow(warnings)] use std::io; use std::error::Error; use std::boxed::Box; use s…

【NumPy】深入解析numpy中的 iscomplex 方法

🌈 欢迎莅临我的个人主页👈这里是我深耕Python编程、机器学习和自然语言处理(NLP)领域,并乐于分享知识与经验的小天地!🎇 🎓 博主简介: 我是云天徽上,一名对技…

下载文件流

export function downloadFile(file, name, type) { const link document.createElement(‘a’) link.href window.URL.createObjectURL(new Blob([file], { type: type })) link.target ‘_blank’ link.download name document.body.appendChild(link) link.click() docu…

Mujoco仿真【xml文件的学习 4】

在学习Mujoco仿真的过程中,mujoco的版本要选择合适。先前我将mujoco的版本升级到了mujoco-3.1.4,在运行act的仿真代码时遇到了问题,撰写了博客: Aloha机械臂的mujoco仿真问题记录-CSDN博客 下面在进行mujoco仿真时,统…

从0开发一个Chrome插件:开发Chrome插件的必要知识

前言 这是《从0开发一个Chrome插件》系列的第二篇文章,本系列教你如何从0去开发一个Chrome插件,每篇文章都会好好打磨,写清楚我在开发过程遇到的问题,还有开发经验和技巧。 专栏: 从0开发一个Chrome插件:什么是Chrome插件? 尽请期待~ Chrome 插件的基本结构 一个C…

Superset二次开发之PG数据库备份策略

背景:基于Superset项目3.0版本二次开发,线上运行之后,需要处理和维护后续的PG数据的备份,迁移,回滚,校验等环节 Superset 默认使用 PostgreSQL(简称 PG)作为其元数据数据库。这个数据库在 Superset 项目中扮演了关键角色: 存储元数据: PG 数据库存储 Superset 的所有…

十_信号3-可重入函数

如上图所示链表,在插入节点的时候捕获到了信号,并且该信号的自定义处理方式中也调用了插入节点的函数。 在main函数中,使用insert向链表中插入一个节点node1,在执行insert的时,刚让头节点指向node1以后(如上图序号1)&…

MySQL学习——获取数据库和表格的信息

如果忘记了数据库或表的名称,或者不确定给定表的结构(例如,其列的名称),该怎么办呢?MySQL通过几个语句解决了这个问题,这些语句提供了有关它支持的数据库和表的信息。 你之前已经看过SHOW DATA…

linux系统下,mysql增加用户

首先,在linux进入mysql mysql -u root -p 然后查看当前用户: select user,host from user; 增加用户语句: CREATE USER 用户名host范围 IDENTIFIED BY 密码;

【操作系统】Linux、Windows各平台CoreDump机制实现详解

LinuxCoreDump机制是Unix/Linux操作系统中的一种功能,它允许在程序异常终止时,将程序的内存状态保存到一个文件中,这个文件通常被称为core文件。以下是CoreDump机制的原理和实现步骤: 信号触发:CoreDump通常由特定的信…

【C++】C++入门1.0

鼠鼠最近在学C,那么好,俺来做笔记了! 目录 1.C关键字(C98) 2.命名空间 2.1.命名空间定义 2.2.命名空间的使用 3.C的输入&&输出 4.缺省参数 4.1缺省参数概念 4.2.缺省参数的分类 5.函数重载 5.1.函数重载概念 5.2.C支持函数…

深度学习-04-数值的微分

深度学习-04-数值的微分 本文是《深度学习入门2-自製框架》 的学习笔记,记录自己学习心得,以及对重点知识的理解。如果内容对你有帮助,请支持正版,去购买正版书籍,支持正版书籍不仅是尊重作者的辛勤劳动,也…

SHA256计算原理

标签: SHA256计算原理;SHA256;SHA-2; SHA-256计算原理 SHA-256(Secure Hash Algorithm 256-bit)是SHA-2系列中的一种哈希算法,它由美国国家安全局(NSA)设计,并由美国国家标准与技术研究院(NIST)发布。SHA-256主要用于数据完整性验证和数字签名等领域。以下是SHA-…

所有人都可以做的副业兼职,短剧推广,1天挣几百,附详细方法!

自从上次向大家介绍了短剧掘金项目以来,便陆续收到了众多朋友的询问:现在是否还能加入短剧掘金的大军?答案是肯定的。目前,无论是各大视频平台还是其他渠道,短剧掘金项目都呈现出蓬勃发展的态势。而且,相关…

SSM高校社团管理系统-计算机毕业设计源码86128

目 录 摘要 1 绪论 1.1研究背景与意义 1.2开发现状 1.3研究方法 1.4 ssm框架介绍 1.5论文结构与章节安排 2 高校社团管理系统系统分析 2.1 可行性分析 2.2 系统流程分析 2.2.1数据增加流程 2.2.2数据修改流程 2.2.3数据删除流程 2.3 系统功能分析 2.3.1 功能性分…

QT实现动态翻译切换

1、实现QT动态中英文切换效果 效果如下: 2、原理 因为软件本身就是中文版,所以只需准备一个英文版的翻译即可,,那就是将所有需要翻译的地方用tr包裹,然后首先执行lupdate更新一下,接着用qt的翻译软件 Qt Linguist打开ts文件进行翻译,然后保存,最后使用 lrelease发布一…