js setTimeout 中怎么返回值

Question

由于DOM加载问题，需要异步后才能获取到DOM的属性， 但是我需要返回这个判断， 怎么写才能返回出去判断后的值；
代码如下，现在是不行的

 checkOver(item){
        let check = false;
          setTimeout(() => {
            check = $('#dept' + item.department_id)[0].offsetWidth < $('#dept' + item.department_id)[0].scrollWidth;
            return check;
          }, 1)
      }

Answer 1

在setTimeout中你是拿不到返回值的，你可以用Promise来wrap一下。

function checkOver(item) {
   let check = false;
   let promise = new Promise(function(resolve, reject) {
     setTimeout(() => {
       check = $('#dept' + item.department_id)[0].offsetWidth < $('#dept' + item.department_id)[0].scrollWidth;
       resolve(check);
     }, 1);
   });
   return promise;
}

checkOver(item).then((check) => {
  console.log(check); // --> true/false
});

Answer 2

异步返回不出去的
关于异步常用两种方式 callback和promise
callback回调:

checkOver(item,callback){
    let check = false;
    setTimeout(() => {
        check = $('#dept' + item.department_id)[0].offsetWidth < $('#dept' + item.department_id)[0].scrollWidth;
        callback&&callback(check)
    }, 1)
}
//调用
checkOver(item,function(check){
    console.log(check)
})

Answer 3

promise包装一下

Answer 4

callback回调或者用promise封装都是可以达到效果的。或者定义一个全局变量，赋值。不过这样没有前两个方案好。

Answer 5

setTimeout是异步运行的，返回不出去，可以用回调函数做自己想要的处理

Answer 6

DOM加载后执行 在mounted 或者 $nextTrick执行就好了 不需要用定时器吧

Answer 7

等等，你们说了这么多难道没想过用$(document).ready()

Answer 8

用promise或者async/await。

Answer 9

setTimeOut没有直接值的返回途径，你只能采用其他方法：

1. 如果支持ES6/7 ，可以采用promise包装，直接处理为异步执行
2. 如果不支持这些特性，你需要在setTimeOut的执行具体函数中去检查相关变量，自己通过回调，或者其他触发调用方式在函数执行中解决值同步问题。

---

不过看你语句，是支持新特性的，可能你需要清理一下你的思路，采用promise包装来进行了。

Answer 10

let s = '';
return new Promise((resolve, reject) => {
    setTimeout(() => {
        s = `
            <div class="mapStreet" ref="mapStreet">
                <div class="arraw"></div>
                <h1>${params.name}</h1>
                ${editFence}
                <div class="inner">
                    ${score}
                    <ul class="list">
                        ${str}
                    </ul>
                </div>
            </div>`;
        resolve(s);
    }, 800);
});