技术频道导航
HTML/CSS
.NET技术
IIS技术
PHP技术
Js/JQuery
Photoshop
Fireworks
服务器技术
操作系统
网站运营

赞助商

分类目录

赞助商

最新文章

搜索

JavaScript this 面试练习题5例

作者:admin    时间:2022-7-5 11:51:49    浏览:

JavaScript面试时,this是必考的题目,因此有必要熟练掌握this这个知识点。在前面,我整理了6个关于this关键字的面试问题,本文中,再次通过5道练习题,学习this的使用。

题目1:

请问,以下的getName 执行结果为:

  1. '全域'
  2. '小明'
function getName() {
  console.log(this.myName);
}
var myName = '全域';

// 主要程序代码
var Ming = {
  myName: '小明',
  getName: getName
};

Ming.getName();

.
.
.
.
.
.
.
本题答案为2. '小明',请记住一个概念,传统函数如何定义不会影响this 的指向,会影响指向的只有调用方式,在此是在 Ming 下调用 getName 的方法,因此this 会指向Ming

题目2:

请问,以下的getName 执行结果为:

  1. '全域'
  2. '小明'
var Ming = {
  myName: '小明',
  getName: function() {
    console.log(this.myName);
  }
};
Ming.getName();

.
.
.
.
.
.
.
这题将 getName 函数直接定义在 Ming 的对象下,概念也与先前相同,不管如何定义,直接看是如何调用,所以本题结果依然是2. '小明'。

题目3:

请问,以下的getName 执行结果为:

  1. '全域'
  2. '小明'
function getName() {
  console.log(this.myName);
}

var myName = '全域';

// 主要程序代码
var Ming = {
  myName: '小明',
  fn: function() {
    getName();
  }
};
Ming.fn();

.
.
.
.
.
.
.
这题在外层调用 fn() 方法,内部再“直接调用getName 函数”,所以函数的 this 是直接由 getName(); 这个调用方式而定(请注意,在此调用的前方没有任何的对象),这种调用方式会称为“simple call”(简单调用),this的指向为window,结果会是1. '全域'。

题目4:

请问,以下的getName 执行结果为:

  1. '全域'
  2. '小明'
  3. '小明家'
function getName() {
  console.log(this.myName);
}

var myName = '全域';

// 主要程序代码
var Ming = {
  myName: '小明',
  family: {
    myName: '小明家',
    getName: getName
  }
  
};
Ming.family.getName();

.
.
.
.
.
.
.
本題是 “对象的方法調用”,只要检视 getName 调用时前方的对象是什么就可确认 this 的指向(family 对象),因此this 指向为family 结果为3. '小明家'。

题目5:

请问,以下的执行结果为:

  1. '全域'
  2. '小明'
var myName = '全域';

// 主要程序代码
var Ming = {
  myName: '小明',
  fn: function() {
    setTimeout(function() {
      console.log(this.myName);
    }, 0);
  }
};
Ming.fn();

.
.
.
.
.
.
.
本题的结果为:1.'全域'

这题算是许多新手会遇到的错误,在对象内调用时如果出现立即函数、回调函数(callback function)结果会有什么变化?绝大多数的情况下这类型都会指向window,所以不建议在此类型下直接调用this

总结

本文通过5道练习题,都是简单的概念题,没有复杂的逻辑及语法,希望通过本文的习题练习,你能更好的掌握this这个知识点。除了本文介绍的,你还可以看看关于this关键字的6个面试问题

相关文章

标签: this  
x
x
  • 站长推荐