简述Vue.js中的箭头函数

daimengdeyang

于 2024-07-02 15:46:34 发布

阅读量176

点赞数 2

文章标签：前端 vue.js

本文链接：https://blog.csdn.net/daimengdeyang/article/details/140128515

版权

一、什么是箭头函数

将原函数的“function”和函数名都删掉，并使用“=>”连接参数列表和函数体。

二、构造箭头函数

三、箭头函数的特征

1、如果箭头函数的参数只有一个，那么括号是可以省略的

2、如果有默认参数括号不可以省略

3 、如果在箭头函数中，如果只有一行代码，且是return ，也就是回调函数，那么可以把大括号和return省略

四、箭头函数this的指向

箭头函数中this指向与我们之前所学的匿名函数中，function 里面的this 指向并不相同。

在匿名函数中，function 里面的this 指向函数调用者。

箭头函数中this指向函数声明处，通常是window。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

daimengdeyang

关注关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
简述Vue.js中的箭头函数

简述箭头函数的定义与特征
复制链接

扫一扫

vuejs学习4.4 vueCLI3和箭头函数

qq_39225271的博客

09-09

468

vueCLI3vueCLI3创建项目vueCLI3目录结构 vueCLI3创建项目 vueCLI3基本上零配置 vue create vuecli3learn 然后pick a preset选择一个配置，这里选择Manually select features来手动选择配置，（空格选择取消），选择完成回车这里选择单独的配置文件便于修改选择n，如果选择了向想删掉， vueCLI3目录结构 ...

vue的学习笔记（12）之箭头函数

肿肿的博客

02-02

6432

箭头函数1、箭头函数的使用2、箭头函数参数和返回值3、箭头函数中的this 1、箭头函数的使用定义函数有三种方式： <script> //箭头函数：也是一种定义函数的方式 //1.定义函数的方式：function const aaa=function () { } //2.对象字面量中定义函数 const obj={ bbb: function () { }, ccc() { } } //3.es6中的箭头函数 // const ddd=(参

参与评论您还未登录，请先登录后发表或查看评论

js---遍历的4种方法 & 箭头函数=＞

时光里的博客

09-07

8000

常规遍历方法 for i forEach 箭头函数=> for of 遍历 for in 遍历 for in 遍历的是数组下表 ,适合遍历集合 箭头函数=> ES6标准新增了一种新的函数：Arrow Function（箭头函数）基础语法 var fn1 = function(a, b) { return a + b } function fn2(a, b) { return a + b } 使用ES6箭头函数语法定义函数，将原函数的“func

vue中的箭头函数 =>

热门推荐

qq_39990827的博客

05-31

4万+

基本语法： ES6允许使用“箭头”（=>）定义函数 var f = a = > a //等同于 var f = function(a){ return a; } 如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。 //无形参 var f = () => 5; // 等同于 var f = function () { return 5 }; //多...

vue 中var _this=this作用

彳亍的博客

06-03

2万+

var _this=this console.log(_this)原来的对象 console.log(this)//当前方法对象 _this只是一个变量名，this代表父函数，如果在子函数还用this，this的指向就变成子函数了，_this就是用来存储指向的 https://blog.csdn.net/cataclysm2012/article/details/803504...

Vue.js中的浏览器兼容性及解决方案

Vue.js在前端开发中的重要性 Vue.js是一款流行的前端框架，它提供了一种简单、灵活的方式来构建交互式的用户界面。Vue.js易于学习和使用，具有响应式数据绑定和组件化的特性，使得前端开发变得更加高效和便捷。 ...

手写Vue.js响应式原理，实现一个自己的Vue响应式框架

鸭绒的博客

10-31

708

文章目录1.简述功能2.创建Vue3.Observer 实现响应式数据 1.简述功能我们实现的一个带有响应式功能的简单Vue框架。功能：负责接收初始化的参数(options) 负责把data中的属性注入到Vue实例，转换成getter/setter 负责调用observer监听data属性中的变化负责调用compiler解析指令/差值表达式 Vue类的结构：前三个是Vue的属性，最后一个是Vue的方法,用于将data设置为setter/getter，并纳入Vue实例中。项目初始结构： 2

简述Vue中容易被忽视的知识点

10-15

在Vue的生命周期钩子或者事件处理器中使用箭头函数可能导致this不再指向Vue实例本身，而是指向全局对象（如window）。正确做法是使用普通函数，这样Vue可以正确地绑定this到Vue实例。示例： ```javascript // 不...

Vuejs（基础）

gxll499294075的博客

04-11

826

vue是什么？一套用于构建用户界面的渐进式JavaScript框架。渐进式：Vue可以自底向上逐层的应用。简单应用：只需一个轻量小巧的核心库。复杂应用：可以引入各式各样的Vue插件。 Vue的特点采用组件化模式，提高代码复用率、且让代码更好维护。声明式编程，让编程人员无需操作DOM，提高开发效率。使用虚拟DOM+优秀的Diff算法，尽量复用DOM节点。地址 Vue官网地址：Vue.js Githup地址：https://github.com...

简述在 Vue 实例中编写生命周期 hook 或其他 option/propertie 时，为什么不使用箭头函数 ？

最新发布

youhebuke225的博客

06-03

329

的正确指向、提高代码的可读性和可维护性、以及遵循 Vue 的设计原则，建议在 Vue 实例中编写生命周期 hook 或其他 option/propertie 时，使用标准的函数声明而不是箭头函数。

Vue中使用箭头函数注意事项

np918的博客

08-01

1958

在Vue中watch中使用了箭头函数 props:{ price:{ type:Number, num:0 } }, data(){ return{ priceDefault:0 } } watch:{ price:(val,ind)=>{ console.log(val,ind) } } 死活不起作用。解决办法翻了下vue中关于watch的说明文档，末尾...

Vue箭头函数的使用

fsy7670的博客

03-04

1662

这里写自定义目录标题Vue箭头函数的使用函数中的代码数量问题箭头函数中this的使用 Vue箭头函数的使用对象自变量中定义函数的原始做法 const obj = { bbb(){ } } 使用箭头函数放入多个参数 const sum (num1, num2) =>{ return num1 + num2 } 使用箭头函数放入一个参数，括号可以省略 const power = num =>{ return num * num }` 函数中的代码数量问题函数块中有多

vue2.0使用ES6语法的箭头函数对this作用域的理解

若晨工作室

09-19

1万+

在做vue项目时用到了axios，但是发现axios请求之后的回调函数里this并不指向当前vue实例，导致浏览器报错。部分代码： test:function(){ let _self = this;//在外层函数内定义变量存储当前vue实例。 this.$axios.post("url",{ }).then(function(res){

ES6中箭头函数的使用

东子的博客细节决定成败，点滴铸就辉煌。

10-10

2229

基本用法ES6允许使用“箭头”（=>）定义函数。 var f = v => v; 上面的箭头函数等同于： var f = function(v) { return v; }; 如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。 var f = () => 5; // 等同于 var f = function () { return 5 };

vue中的箭头函数的作用

Ying_yy的博客

08-08

1911

首先，在Vue所有的生命周期钩子方法（如beforeCreate，created，beforeMount，mounted，beforeUpdate，updated，beforeDestory以及destoyed）里使用this，this指向调用它的Vue实例，即（new Vue）。其次，箭头函数没有自己的this，它的this是继承而来；默认指向在定义它时所处的对象（宿主对象），而不是执行时的...

通过vue.js 学习来总结es6语法中的箭头函数，箭头函数原理分析。

acoolgiser的博客

04-25

1431

首先我们来学习一下大神对箭头函数的剖析： ----------------------------------------------横线部分来自廖雪峰大神的官方网站------------------------------------------------------------------------------ ES6标准新增了一种新的函数：Arrow Function（箭头函数）。...

vue——箭头函数

weixin_42457563的博客

08-31

4024

//第一个例子： function a(b) { return b+1; } //等同于下面这个箭头函数（去掉function函数，参数只有一个可以省略小括号，小括号与大括号之间有一个箭头，如果没有大括号则直接是返回值，有大括号必须写return） let a = b => b+1; //第二个例子： function a(b) { return function (c)...

vue2.0函数(箭头函数)的this作用域

anmi7832的博客

09-26

919

在做vue项目时用到了axios，但是发现axios请求之后的回调函数里this并不指向当前vue实例，从而导致浏览器报错。出错代码及结果: created : function(){ axios.get('static/data.json').then(function(res){ console.log(this) //un...