菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 前端基础-陈旭辉-20230620 [打印本页]

作者: 陌殇 时间: 2023-6-25 18:31
标题: 前端基础-陈旭辉-20230620
一、学习内容

1、过滤器

作用：过滤器和函数是用来处理数据的

分类：全局过滤器和局部过滤器

出现位置：双花括号插值{{}}和 v-bind 表达式

2、计算属性computed

问题：插值语法中，语句过于复杂不利于维护

例如：字符串反转 {{msg.split('').reverse().join('')}}

此时就需要用计算属性：

本质是个function方法，实时监听 data 中数据的变化，并返回一个计算后的新值。

声明在computed选项中，

2.1 计算属性computed和方法methods的区别

计算属性类似于 methods 选项中定义的函数 (双向绑定)

计算属性：会进行缓存，只有依赖数据发生改变,才会重新进行计算

函数：每次都会执行函数体进行计算。

2.2 计算属性的应用场景

由于计算属性会将返回的结果缓存起来

所以如果返回的数据不经常发生变化,

那么使用计算属性的性能会比使用函数的性能高

3、计算属性和监听器的区别

computed：支持缓存，只有依赖数据发生改变,才会重新进行计算

watch：不支持缓存，数据变,直接会触发相应的操作。

数据经常变化用watch，不经常变化用computed。

3.2、使用场景

watch擅长处理的场景：一个数据影响多个数据

computed擅长处理的场景：一个数据受多个数据影响

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)