首页 > 其他分享 >前端面试题之代码输出(十七)

前端面试题之代码输出(十七)

时间:2023-11-01 10:32:53浏览次数:26  
标签:输出 面试题 obj 代码 十七 self 前端

书接之前代码输出题目,

异步&事件循环

前端面试题之代码输出

前端面试题之代码输出二

前端面试题之代码输出三

前端面试题之代码输出四

前端面试题之代码输出五

前端面试题之代码输出六

前端面试题之代码输出七

前端面试题之代码输出八

前端面试题之代码输出九

前端面试题之代码输出十

前端面试题之代码输出十一

前端面试题之代码输出十二

前端面试题之代码输出十三

前端面试题之代码输出十四

前端面试题之代码输出十五

this

前端面试题之代码输出十六

前端面试题之代码输出十七

5.代码输出结果
var obj = {
    say: function () {
        var f1 = () => {
            console.log("1111", this);
        }
        f1();
    },
    pro: {
        getPro: () => {
            console.log(this);
        }
    }
}
var o = obj.say;
o();
obj.say();
obj.pro.getPro();

输出结果如下:

1111 window对象
1111 obj对象
window对象

代码执行顺序如下:

  1. o(),o是在全局执行的,而f1是箭头函数,它是没有绑定this的,它的this指向其父级的this,其父级say方法的this指向的是全局作用域,所以会打印出window;
  2. obj.say(),谁调用say,say 的this就指向谁,所以此时this指向的是obj对象;
  3. obj.pro.getPro(),我们知道,箭头函数时不绑定this的,getPro处于pro中,而对象不构成单独的作用域,所以箭头的函数的this就指向了全局作用域window。
6.代码输出结果
var myObject = {
    foo: "bar",
    func: function () {
        var self = this;
        console.log(this.foo);
        console.log(self.foo);
        (function () {
            console.log(this.foo);
            console.log(self.foo);
        }());
    }
};
myObject.func();

输出结果如下:

bar
bar
undefined
bar

代码执行顺序如下:

  1. 首先func是由myObject调用的,this指向myObject。又因为var self = this;所以self指向myObject。
  2. 这个立即执行匿名函数表达式是由window调用的,this指向window 。立即执行匿名函数的作用域处于myObject.func的作用域中,在这个作用域找不到self变量,沿着作用域链向上查找self变量,找到了指向 myObject对象的self。


标签:输出,面试题,obj,代码,十七,self,前端
From: https://blog.51cto.com/u_16283446/8119535

相关文章

  • 记录一次前端表格选型过程
    客户需求:最近,接到一个客户项目,前期沟通时,客户说,我们日常基本都是使用Excel来做一些信息收集。但是每次收集信息时,都需要文件传来传去,十分麻烦。本来是想着用一些云文档,但是沟通下来领导层没通过,主要原因是:(1)内部文件安全级别高,信息不能托管在其它三方平台上,这就需要对云文档做私有......
  • 二、搭建前后端分离的自动化测试平台的前端Vue3+Element-plus前端项目
    一、安装Node.js以及配置环境变量1、Node获取地址https://nodejs.org/en/download一直默认选项安装,安装好了之后,在环境变量中会自动配置Node的地址,可以在cmd中使用node-v/npm-v命令验证是否下载成功2、设置Node的配置内容(1)在安装目录下新建两个文件夹命名为node_cache,和no......
  • 前端大文件切片上传,断点续传、秒传等解决方案,vue中使用实例
    先看逻辑如何切片?如何获取文件唯一hash?与后端交互获取文件上传的状态,用于判断情况,是秒传还是续传?上传切片文件,判断失败文件重新执行?全部上传完成通知后端?1、先上全部代码,后面第2部分解析、第3部分vue中使用相关依赖spark-md5主要用于拿取文件的md5mitt发布订阅importSparkMD5......
  • Spring Boot - ffmpeg 获得 m3u8 列表和 ts 文件,前端请求视频流进行播放
    安装ffmpegFFmpeg下载地址:GitHubreleases。请下载:ffmpeg-master-latest-win64-gpl-shared.zip压缩包。解压到你系统盘任意位置(前提是你以后找得到这玩意儿在哪)。接下来就是配置其环境变量,所有的环境变量都是配置它的启动文件的路径到你系统的Path,基本上都是(也有例外的?)。如......
  • Java基础面试题收集(1)
    @目录1.一个“.Java"源文件中是否可以包括多个类(不是内部类)?有什么限制?2.Java有没有goto?3.&于&&的区别4.在Java中如何跳出当前的多重嵌套循环?5.Switch语句能否用在byte,long,String上?6.shorts1=1;s1=s1+1;有什么错?shorts1=1;s1+=1;有什么错?7.char型变量中能不能存储一个......
  • 第十章、web前端架构师
    目录二十二、大型项目的编译,部署以及性能优化1、前言二十二、大型项目的编译,部署以及性能优化1、前言......
  • 转 软件测试面试题100题
    转 软件测试100题转的地址:软件测试常见面试题合集(内附详细答案)-NING的文章-知乎https://zhuanlan.zhihu.com/p/619120396 写文章  软件测试常见面试题合集(内附详细答案)NING ​关注她 你赞同过软件测试和开发相关内容最近看到......
  • Chrome浏览器查看前端参数
    按F12或者右键点击“检查”进入开发者模式。点击这个箭头图标,即可选择要查看参数的区域。 查看表格的行高和列宽当鼠标移到某区域,就会出现浮层,显示此区域的长和宽 查看字体和字号在搜索栏搜索关键字“font-size”可找到字号 ......
  • 网页CAD(web cad sdk)前端直接获取修改转换后的图纸数据
    前言有用户集成网页CAD之后,需要提取图纸的各种信息和数据,下面我们讲一下Web版CAD如何在前端直接提取修改和转换后的图纸信息,没有集成过在线CAD的小伙伴可以先看一下快速入门在mxcad中转换后的图纸(.mxweb格式的文件)可以通过mxcadnpm包得到图纸的各种数据,如图层、文字样式、图......
  • 编译第三方前端项目时候出现Syntax Error: TypeError: Cannot set properties of unde
    编译第三方的前端项目时候出现下面问题 ERROR Failedtocompilewith1error                                                             ......