this

this 指向并不是在函数定义的时候确定的,而是在调用的时候确定的。换句话说,函数的调用方式(直接调用、方法调用、new调用、bind、call、apply、箭头函数)决定了 this 指向。


直接调用

函数内部的 this 指向全局对象,在浏览器中全局对象是 window,在 NodeJs 中全局对象是 global。直接调用并不是指在全局作用域下进行调用,在任何作用域下,直接通过 函数名(...) 来对函数进行调用的方式,都称为直接调用。

方法调用

函数中的 this 指向调用该方法的对象。通过对象来调用其方法函数,它是 对象.方法函数(...) 这样的调用形式。

new调用

在 es5 中,用 new 调用一个构造函数,会创建一个新对象,而其中的 this 就指向这个新对象。

箭头函数

箭头函数没有自己的 this 绑定,箭头函数中使用的 this,其实是直接包含它的那个函数或函数表达式中的 this。


Ps:非函数被调用时(这里分别打印40和10)

当obj在全局声明时,无论obj.c在什么地方调用,这里的this都指向全局对象,而当obj在函数环境中声明时,这个this指向undefined,在非严格模式下,会自动转向全局对象。

Vue.js-this详解的更多相关文章

  1. Vue.js项目详解

    还是以Blog项目来讲解,最近我本人利用闲暇时间,以博客作为参考学习一些新的技术并尝试之前没有尝试过的思路来玩玩. 技术看似枯燥,但是带有一个目的来学,你会发现还是蛮有趣的. 主要实践的就是前后端分离 ...

  2. vue.js使用详解

    1.什么是vue.jsvue.js是一款数据驱动型的js框架.何为数据驱动型?html视图层定义模板,vue定义数据.html和vue数据,通过标签id关联. 2.vue.js引入<script ...

  3. Vue.js 插件开发详解

    前言 随着 Vue.js 越来越火,Vue.js 的相关插件也在不断的被贡献出来,数不胜数.比如官方推荐的 vue-router.vuex 等,都是非常优秀的插件.但是我们更多的人还只停留在使用的阶段 ...

  4. Vue.js用法详解(一)更新中~

      前  言 前段时间为了一个数据查询的项目自学了Vue,感觉这款框架还是很不错的,今天就整理整理这个框架如何使用,希望对正在学这个框架的小伙伴有所帮助~ 首先,我们先来了解一下Vue: Vue.js ...

  5. Vue.js路由详解

    有时候,我们在用vue的时候会有这样的需求,比如一个管理系统,点了左边的菜单栏,右边跳转到一个新的页面中,而且刷新的时候还会停留在原来打开的页面. 又或者,一个页面中几个不同的画面来回点击切换,这两种 ...

  6. main.js index.html与app.vue三者关系详解

    main.js index.html与app.vue三者关系详解 2019年01月23日 11:12:15 Pecodo 阅读数 186   main.js与index.html是nodejs的项目启 ...

  7. vue 文件目录结构详解

    vue 文件目录结构详解 本篇文章主要介绍了vue 文件目录结构详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 项目简介 基于 vue.js 的前端开发环境,用于前后 ...

  8. vue 源码详解(一):原型对象和全局 `API`的设计

    vue 源码详解(一):原型对象和全局 API的设计 1. 从 new Vue() 开始 我们在实际的项目中使用 Vue 的时候 , 一般都是在 main.js 中通过 new Vue({el : ' ...

  9. vue 源码详解(二): 组件生命周期初始化、事件系统初始化

    vue 源码详解(二): 组件生命周期初始化.事件系统初始化 上一篇文章 生成 Vue 实例前的准备工作 讲解了实例化前的准备工作, 接下来我们继续看, 我们调用 new Vue() 的时候, 其内部 ...

  10. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

随机推荐

  1. URL shortening service

    Use Cases 1, shortening : take a URL => return a much shorter URL 2, redirection : take a short U ...

  2. array mysql_fetch_row(resource result)

    array mysql_fetch_row(resource result) 函数返回从结果集result中取得的行生成的数组,若到了最后一行之后则返回false,每个结果的列存储在一个数组的单元中 ...

  3. QDUOJ ycb的ACM进阶之路 二进制多重背包

    ycb的ACM进阶之路 发布时间: 2017年5月22日 14:30   最后更新: 2017年5月22日 14:31   时间限制: 1000ms   内存限制: 128M 描述 ycb是个天资聪颖 ...

  4. HDU - 6114 2017百度之星初赛B Chess

    Chess  Accepts: 1805  Submissions: 5738  Time Limit: 2000/1000 MS (Java/Others)  Memory Limit: 32768 ...

  5. mysql给id生成uuid

    mysql中id一般都设为uuid,除了我们在后台用到的uuid利用jpa注解来生成外,其实在mysql中直接也可以生成 直接上代码: 1.mysql中直接使用uuid()函数,可以生成一个随机的uu ...

  6. PCANet: A Simple Deep Learning Baseline for Image Classification?----中文翻译

    一 摘要 在本文中,我们提出了一个非常简单的图像分类深度学习框架,它主要依赖几个基本的数据处理方法:1)级联主成分分析(PCA);2)二值化哈希编码;3)分块直方图.在所提出的框架中,首先通过PCA方 ...

  7. 解码H264文件的一些基础知识

    这段时间一直在进行编写H264文件的解析类,因此对于H264文件的格式有了初步的了解,官方文档也看了个大概.这篇文章主要是总结了一些为解码H264文件而需要的一些前期知识,话不多说,下面是干货,有些是 ...

  8. Windows CreateEvent,SetEvent,WaitForSingleObject的用法

    http://blog.pfan.cn/embed/19089.html WaitForSingleObject的用法 DWORD WaitForSingleObject(   HANDLE hHan ...

  9. solidity 学习笔记(4)library库

    library库的申明: library SafeMath{ functrion mul(uint a,uint b) public returns (uint){ uint c= a*b; asse ...

  10. 洛谷 P2216 [HAOI2007]理想的正方形

    P2216 [HAOI2007]理想的正方形 题目描述 有一个a*b的整数组成的矩阵,现请你从中找出一个n*n的正方形区域,使得该区域所有数中的最大值和最小值的差最小. 输入输出格式 输入格式: 第一 ...