Martin

下面介绍一些 Vue 实用的姿势与技巧。

[tip] 妙用 watchers

在 watchers 中，可以直接使用函数的字面量名称；其次，声明 immediate:true 表示创建组件时立马执行一次

1
2
3
4
5
6

watch: {
    searchInputValue:{
        handler: 'fetchPostList',
        immediate: true
    }
}

原题

这是一道关于二叉树遍历的题目：leetcode-103

给定一个二叉树，返回其节点值的锯齿形层次遍历。（即先从左往右，再从右往左进行下一层遍历，以此类推，层与层之间交替进行）。

例如 [3,9,20,null,null,15,7]：

1
2
3
4
5

  3
 / \
9  20
  /  \
 15   7

则返回：

1
2
3
4
5

[
  [3],
  [20,9],
  [15,7]
]

引子

笔者这周在开发上面遇到了一个 Vue 的问题，就是文章标题所提到的。笔者觉得这个问题非常普遍，但是鲜有资料，所以拿出来分享并一起探讨一下。

首先，说一下当时问题发生的一个具体的场景：

1. 不同页面组件都需监听只由父组件触发的特定事件（如 myevent）
2. 这些页面组件在同一时间内只会挂载一个
3. 当前页面在此事件触发之后需要实现特定的业务逻辑

那好，实现这样的场景需求其实也挺简单：只需在各个页面组件创建时监听这个事件，销毁时取消监听就可以了。

然而，问题出现了。

记录一道 LeetCode 题的个人思路及其演进过程。

该题出自 LeetCode 121。

问题描述

给定一个数组，它的第 i 个元素是一支给定股票第 i 天的价格。

如果你最多只允许完成一笔交易（即买入和卖出一支股票），设计一个算法来计算你所能获取的最大利润。

注意你不能在买入股票前卖出股票。

本文章以浏览器环境为主。

先从三道题目说起

1. 宏任务有哪些？微任务有哪些？请各举几个。

2. 定时器真的是按照设定的时间定时执行吗？为什么？

3. 什么是宏任务？什么是微任务？它们之间怎么界定？请说说你的理解。

这三道题由浅入深，读者可以先思考一下。