我对 setTimeout 有基本的了解，也知道为什么需要使用立即调用的函数来执行问题标题中所述的操作。但是，我的尝试并没有完成我想要做的事情。 Self.instruct 设置了一个反应数据元素，以便将消息显示在屏幕上。最终只显示每个对象数组的最后一个元素。

    export default {
         name: 'hello',
         props: ['tolearn'],
         data () {
         return {
             message: 'Welcome to Your Vue.js App',
             toLearn: {},
             instruct: ''
         }
         },
         methods: {
    showSlow: function(){
         var self = this;
         categoriesRef.once('value', function(snapshot){
         var val = snapshot.val();
         var sysName = val.name;
         var sysChildren = val.children;
         console.log(Object.keys(val.children) + " are the aspect names")

         sysChildren.forEach(function(aspect){
             (function(aspect){
             //self.instruct = aspect.name + ' is one aspect of ' + sysName + '.';         
             setTimeout(function(){
                 aspect.children.forEach(function(group){

                 (function(group){

                     //self.instruct = aspect.name + ' contains the group ' + group.name + '.';
                     setTimeout(function(){
                     group.children.forEach(function(item){

                         (function(item){
                         console.log(item.name + ' is being considered')


   self.instruct = group.name + ' contains the item ' + item.name + '.';
                     setTimeout(function(){
                         self.instruct = '';
                     }.bind(self), 800)
                     })(item)                        
                 })                          
                 }.bind(self), 100)
             })(group)               
             })                      
         }.bind(self), 1500)
         })(aspect)
     })
     })
     }
     }
 }

基本上，从快照中获取的 val 是一个 3 级深的 json 树结构，每级包含一个 name 和一个 children 属性。

程序运行完成后， console.log 会同时输出多个“itemname 正在考虑中”消息。

有人能帮我弄清楚如何正确编写它，以便显示树的所有元素吗？不知何故我的 IIFE 不够用。