js 回調地獄的另類解決方案嘗試

例如 經過學生獲取學生所在學校信息,須要先查詢學生所在班級,再經過班級查詢所在學校信息。js代碼相似寫法以下:javascript

function getStudentSchool(id) {
    ajax.get("/Test/GetStudent", { "studentId": id }, function (student) {
        if (student != null && student.ClassId != null) {
            ajax.get("/Test/GetClass", { "classId": student.ClassId }, function (studentClass) {
                if (studentClass != null && studentClass.SchoolId != null) {
                    ajax.get("/Test/GetSchool", { "schoolId": studentClass.SchoolId }, function (school) {
                        if (school != null) {
                            console.log(school);
                        }
                    });
                }
            });
        }
    });
}
 
//調用入口方法
window.οnlοad= function(){
	getStudentSchool(1);
};

  寫了個類經過設置相關業務信號量來綁定觸發的方法,當信號變量改變時就會自動調用相應的方法,改進方法以下:html

function AsynFlag() { if (typeof this.setFlag != "function") { AsynFlag.prototype.setFlag = function (obj, name, fun) { if (obj.hasOwnProperty(name)) { obj[name + "_fun"] = fun; return; } obj[name] = 0; obj[name + "_"] = 0; Object.defineProperty(obj, name, { get: function () { return obj[name + "_"]; }, set: function (value) { if (value != obj[name + "_"]) { obj[name + "_"] = value; } else { return; } if (obj[name + "_fun"] == null) { obj[name + "_fun"] = fun; } obj[name + "_fun"](); } }); }; } } var param = { "studentId": 0, "classId": 0, "schoolId": 0 }; var s = new AsynFlag(); var flag = {}; function getStudent() { ajax.get("/Test/GetStudent", { "studentId": param.studentId }, function (student) { if (student != null && student.ClassId != null) { param.classId = student.ClassId; s.setFlag(flag, "canGetClass", getClass); flag.canGetClass = true; } }); } function getClass() { ajax.get("/Test/GetClass", { "classId": param.ClassId }, function (studentClass) { if (studentClass != null && studentClass.SchoolId != null) { param.SchoolId = studentClass.SchoolId; s.setFlag(flag, "canGetSchool", getSchool); flag.canGetSchool = true; } }); } function getSchool() { ajax.get("/Test/GetSchool", { "schoolId": param.SchoolId }, function (school) { if (school != null) { console.log(school); } }); } //調用入口方法
window.onload= function(){ param.studentId =1; getStudent(); };

flag 是個信號量設置對象,s.setFlag(flag, "canGetClass", getClass); 設置flag擁有canGetClass屬性,而且該屬性綁定函數getClass,  當第一個ajax得到數據後設置信號並改變信號量觸發綁定的getClass函數,flag對象中會自動建立canGetClass,java

canGetClass_, 兩個屬性和一個canGetClass_fun方法來實現當canGetClass改變時調用canGetClass_fun=getClass。git

以上代碼實際測試可行。github

代碼已上傳github https://github.com/SaFaJim/AsynFlag
————————————————
版權聲明:本文爲CSDN博主「皮皮蝦大俠」的原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處連接及本聲明。
原文連接:https://blog.csdn.net/Asa_Jim/article/details/86648199ajax

原文出處:https://www.cnblogs.com/DeepinCoding/p/11995287.html函數

相關文章
相關標籤/搜索