javascript - Mengapa janji dalam gelung for tidak boleh membaca indeks

Question

for (var key in arr) {
  if (arr.hasOwnProperty(key)) {
    console.log('这一次可以输出key'+key)
    this.$http.post('/getPaperListByCIdAndTId', {
      teacherId: window._const.teacherId,
    }).then((res_in) => {
      console.log('这一次不能输出key'+key)
    })
  }
} 

Keluaran kedua ialah $remove

Atau beritahu saya cara mendapatkan kunci masuk .then

Answer 1

Kata kunci: penutupan

Answer 2

Ia akan menjadi lebih elegan untuk menggunakan array.map untuk menyelesaikannya

Answer 3

Ditutup, cuma gantikan var dengan let in es6

Answer 4

Masalah ini ialah masalah skop pembolehubah gelung biasa. then() 中的回调被调用的时候 key 可能已经循环到最后一个了(也可能是间的某个值)，所以里面使用的 key 值是当时的 key 值。这在 ES6 中要可以用 let 代替 var untuk menyelesaikannya (kerana saya nampak anda telah pun menggunakan fungsi anak panah ES6, jadi gunakan ES6 dahulu)

for (let key in arr) {
    if (arr.hasOwnProperty(key)) {
        console.log("这一次可以输出key" + key);
        this.$http.post("/getPaperListByCIdAndTId", {
            teacherId: window._const.teacherId
        }).then((res_in) => {
            console.log("这一次不能输出key" + key);
        });
    }
}

Jika anda ingin menulis ES5, anda boleh menggunakan IIFE untuk mengelak nilai kunci setempat (dilalui melalui parameter, jadi ia tidak akan berubah)

for (var key in arr) {
    if (arr.hasOwnProperty(key)) {
        (function() {
            console.log("这一次可以输出key" + key);
            this.$http.post("/getPaperListByCIdAndTId", {
                teacherId: window._const.teacherId
            }).then(function(res_in) {
                console.log("这一次不能输出key" + key);
            });
        })(key);
    }
}

Kaedah penulisan berfungsi yang disyorkan, ia kelihatan lebih mudah, ES6 boleh melakukannya seperti ini

Object.keys(arr)
    .filter(key => arr.hasOwnProperty(key))
    .forEach(key => {
        console.log(`这一次可以输出 key：${key}`);
        this.$http.post("/getPaperListByCIdAndTId", {
            teacherId: window._const.teacherId
        }).then(res_in => {
            console.log(`这一次不能输出 key 才怪：${key}`);
        });
    });

ES2017 juga boleh menggunakan async, sintaksnya lebih ringkas

Object.keys(arr)
    .filter(key => arr.hasOwnProperty(key))
    .forEach(async key => {
        console.log(`这一次可以输出 key：${key}`);
        const res_in = await this.$http.post("/getPaperListByCIdAndTId", {
            teacherId: window._const.teacherId
        });
        console.log(`这一次不能输出 key 才怪：${key}`);
    });

Answer 5

Saya baru sahaja mengujinya, ia berfungsi, dan anda mesti menggunakan let dan bukannya var, jika tidak, output akan menjadi kunci terakhir