在 vue 里面到底哪种写法比较规范？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 1621 天前的主题，其中的信息可能已经有所发展或是发生改变。

我看到很多项目里面对于 this 指向的写法都是 let self = this; 有些人跟我说就这样写，有些人又说这种写法不规范？请教一下 V 站的大佬，哪种比较规范？

写法

this

规范

Vue

43 条回复 • 2020-06-29 10:10:17 +08:00

nianyu

2020-06-27 16:50:53 +08:00

let self = this 没问题，以前很多库的源码都是这么写的，这东西无所谓的

ujued

2020-06-27 16:56:14 +08:00 via iPhone

let forClosure = this

loading

2020-06-27 16:57:24 +08:00 via Android

let that=this
或者
let _this=this

sagaxu

2020-06-27 16:59:35 +08:00 via Android

写 const 也行

Biwood

2020-06-27 17:04:44 +08:00

既然已经用 let 关键字了，那么完全可以用箭头函数来规避这种语法，我反正是从写 ES6 开始很久都没这么写了，除非你有什么特殊需求？

Hanggi

2020-06-27 17:12:11 +08:00

这个问题上次不是都说了嘛：

const 这个 = this;

这个.submit();

qyc666

2020-06-27 17:51:59 +08:00 via iPhone

为什么不用箭头函数

seeker

2020-06-27 18:05:38 +08:00

哪那么多讲究的，我都是 `const this2 = this`

ChanKc

2020-06-27 18:09:00 +08:00

箭头函数，self，that 都可以

xxx749

2020-06-27 18:14:15 +08:00 via Android

const context = this

Trim21

2020-06-27 18:21:57 +08:00 via Android

我之前看人用的 vm

zhuangzhuang1988

2020-06-27 18:30:52 +08:00

自己怎么爽怎么来..

ChanKc

2020-06-27 18:32:12 +08:00

@Trim21 vm 就只在 Vue 的场景下比较合适，没有 that 或者 self 通用

ye22st

2020-06-27 18:41:08 +08:00

好的，谢谢各位大佬解答。

BXGo

2020-06-27 18:43:15 +08:00 via Android

有文档规范

mxT52CRuqR6o5

2020-06-27 18:50:00 +08:00 via Android

没有那种最规范，看团队怎么规定

SilentDepth

2020-06-27 19:51:10 +08:00

没见过有规范明确要求这样处理 this 。只要不产生歧义，并且你（和你的协作者）清楚 this 在代码中的实际指向，怎么写着爽怎么来。

surfwave

2020-06-27 19:53:15 +08:00

用箭头函数啊

Lxxyx

2020-06-27 20:00:04 +08:00

一直用的 ctx 。

```js
const ctx = this;
```

ppgs8903

2020-06-27 20:09:54 +08:00

let that = this
其他都容易冲突，self 用在类 CLASS 的方案里面，不建议

ChanKc

2020-06-27 20:38:04 +08:00

@ppgs8903 这个怎么说？

zhuisui

2020-06-27 20:58:14 +08:00

@ChanKc 比如 self 在 webpack 被导出作为 this 的别名是很常见的，所以认为它应该是 window 的别名

Vegetable

2020-06-27 21:45:23 +08:00

变量名还有啥规范，纯粹一点好吗，何况现在有箭头函数

ChanKc

2020-06-27 23:00:04 +08:00

@zhuisui 感谢 https://github.com/webpack/webpack-dev-server/issues/792

wish8023

2020-06-27 23:22:48 +08:00 via Android

建议用 ES6 语法，在现代浏览器，基本都可用了。

WilliamLin

2020-06-28 08:18:23 +08:00

let _this = this

hitaoguo

2020-06-28 09:07:48 +08:00

能不要新定义个变量就不要定义，这样能加深你对 this 指向的理解。
大部分情况下用箭头函数就能解决。
除非说在函数里面有它自己的 this 需要用到，同时还需要外部的 this，那么写 vue 的话我一般是 let vm = this 。

gitjavascript

2020-06-28 09:35:44 +08:00

反正 let 肯定是不好的

guanhui07

2020-06-28 09:38:19 +08:00

_this 或
that 用的人比较多

cz5424

2020-06-28 10:29:39 +08:00

建议改成 ES6，不用 this 。this 真烦

TomatoYuyuko

2020-06-28 10:30:42 +08:00

见过用 entity = this 的也不错，

Junh

2020-06-28 10:32:16 +08:00 via iPhone

这好像和 vue 没什么关系吧

optional

2020-06-28 11:08:43 +08:00

为啥是 let ？这里显然应该用 const
`
const self = this
const $this = this
const _this = this
·

Tdy95

2020-06-28 11:17:09 +08:00

业务代码里面使用箭头函数，保证 this 指向不丢失即可。

vue 的生命周期等方法调用的时候都帮你把 this 实例注入了好了

wobuhuicode

2020-06-28 11:19:58 +08:00

其实写习惯了 C 系列语言都喜欢 let self = this
写习惯 java 的估计就喜欢 let that = this
写习惯前端的都喜欢用箭头函数。

xiangyuecn

2020-06-28 12:27:44 +08:00

This

Martox

2020-06-28 14:02:12 +08:00

let that = this

soulmt

2020-06-28 14:04:27 +08:00

我就觉得很 low 多此一举不是么

soulmt

2020-06-28 17:32:09 +08:00

@hitaoguo 对，如果不是为了区分 2 个 this 不一致，完全没必要申明一个新的；

sunwang

2020-06-28 17:36:55 +08:00

有了箭头函数就没用过这个写法了

kinghly

2020-06-28 17:42:08 +08:00 via Android

先要明白为什么这么写，可以看下 js 闭包。let 、const 、()=>{}不是万能的。

ghosthcp516

2020-06-28 18:05:41 +08:00

要么用箭头函数，如果要写兼容代码请用 var self = this，你这个等于是缝合怪写法

ryanlid

2020-06-29 10:10:17 +08:00

在浏览器中，self 是有值的，指向当前 window 对象的引用。

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/self