Äú¿ÉÒÔ¾èÖú£¬Ö§³ÖÎÒÃǵĹ«ÒæÊÂÒµ¡£

1Ôª 10Ôª 50Ôª





ÈÏÖ¤Â룺  ÑéÖ¤Âë,¿´²»Çå³þ?Çëµã»÷Ë¢ÐÂÑéÖ¤Âë ±ØÌî



  ÇóÖª ÎÄÕ ÎÄ¿â Lib ÊÓÆµ iPerson ¿Î³Ì ÈÏÖ¤ ×Éѯ ¹¤¾ß ½²×ù Model Center   Code  
»áÔ±   
   
 
     
   
 ¶©ÔÄ
  ¾èÖú
Éè¼ÆÄ£Ê½ÔÚǰ¶ËÏîÄ¿ÖеÄÓ¦ÓÃ
 
  1564  次浏览      27
 2021-9-10 
 
±à¼­ÍƼö:
±¾ÎÄÖ÷Òª½éÉÜǰ¶ËµÄÉè¼ÆÄ£Ê½ÊÇʲô£¬Éè¼ÆÄ£Ê½µÄÖÖÀ࣬ǰ¶Ë³£ÓõļÆÄ£Ê½Ó¦ÓÃʵÀý£¬Ï£Íû¶ÔÄúµÄѧϰÓÐËù°ïÖú¡£
±¾ÎÄÀ´×Ôwebǰ¶Ë¿ª·¢£¬ÓÉ»ðÁú¹ûÈí¼þAlice±à¼­¡¢ÍƼö¡£

ǰ¶ËµÄÉè¼ÆÄ£Ê½ÊÇʲô

Éè¼ÆÄ£Ê½Ò»¸ö±È½Ïºê¹ÛµÄ¸ÅÄͨË×À´½²£¬ËüÊÇÈí¼þ¿ª·¢ÈËÔ±ÔÚÈí¼þ¿ª·¢¹ý³ÌÖÐÃæÁÙµÄһЩ¾ßÓдú±íÐÔÎÊÌâµÄ½â¾ö·½°¸¡£

µ±È»£¬ÔÚʵ¼Ê¿ª·¢Öв»ÓÃÉè¼ÆÄ£Ê½Í¬ÑùÒ²ÊÇ¿ÉÒÔʵÏÖÐèÇóµÄ£¬Ö»ÊÇÔÚÒµÎñÂß¼­±È½Ï¸´ÔÓµÄÇé¿öÏ£¬´úÂë¿É¶ÁÐÔ¼°¿Éά»¤ÐÔ±ä²î¡£

ËùÒÔËæ×ÅÒµÎñÂß¼­µÄÀ©Õ¹£¬Á˽ⳣÓÃÉè¼ÆÄ£Ê½½â¾öÎÊÌâÊǷdz£ÓбØÒªµÄ¡£

ǰ¶ËµÄÉè¼ÆÄ£Ê½µÄ»ù±¾×¼Ôò

µ¥Ò»Ö°ÔðÔ­Ôò£ºÃ¿¸öÀàÖ»ÐèÒª¸ºÔð×Ô¼ºµÄÄDz¿·Ö£¬ÀàµÄ¸´ÔӶȽµµÍ¡£

¿ª±ÕÔ­Ôò£ºÒ»¸öʵÌ壬ÈçÀࡢģ¿éºÍº¯ÊýÓ¦¸Ã¶ÔÀ©Õ¹¿ª·Å£¬¶ÔÐ޸Ĺرգ¬ÈóÌÐò¸üÎȶ¨¸üÁé»î¡£

ÀïÊ½Ìæ»»Ô­Ôò£ºËùÓÐÒýÓûùÀàµÄµØ·½±ØÐëÄÜ͸Ã÷µØÊ¹ÓÃÆä×ÓÀàµÄ¶ÔÏó£¬Ò²¾ÍÊÇ˵×ÓÀà¶ÔÏó¿ÉÒÔÌæ»»Æä¸¸Àà¶ÔÏ󣬶ø³ÌÐòÖ´ÐÐЧ¹û²»±ä¡£±ãÓÚ¹¹½¨À©Õ¹ÐÔ¸üºÃµÄϵͳ¡£

ÒÀÀµµ¹ÖÃÔ­Ôò£ºÉϲãÄ£¿é²»Ó¦¸ÃÒÀÀµµ×²ãÄ£¿é£¬ËüÃǶ¼Ó¦¸ÃÒÀÀµÓÚ³éÏó£»³éÏó²»Ó¦¸ÃÒÀÀµÓÚϸ½Ú£¬Ï¸½ÚÓ¦¸ÃÒÀÀµÓÚ³éÏó¡£Õâ¿ÉÒÔÈÃÏîĿӵÓб仯µÄÄÜÁ¦¡£

½Ó¿Ú¸ôÀëÔ­Ôò£º¶à¸öÌØ¶¨µÄ¿Í»§¶Ë½Ó¿ÚÒªºÃÓÚÒ»¸öͨÓÃÐÔµÄ×ܽӿڣ¬ÏµÍ³Óиü¸ßµÄÁé»îÐÔ¡£

µÏÃ×ÌØÔ­Ôò£¨×îÉÙ֪ʶԭÔò£©£ºÒ»¸öÀà¶ÔÓÚÆäËûÀàÖªµÀµÄÔ½ÉÙÔ½ºÃ£¬Ò²¾ÍÊÇ˵һ¸ö¶ÔÏóÓ¦µ±¶ÔÆäËû¶ÔÏóÓо¡¿ÉÄÜÉÙµÄÁ˽⡣

Éè¼ÆÄ£Ê½µÄÖÖÀà

1¡¢ ´´½¨ÐÍģʽ

Ò»°ãÓÃÓÚ´´½¨¶ÔÏó¡£

°üÀ¨£ºµ¥Àýģʽ,¹¤³§·½·¨Ä£Ê½,³éÏ󹤳§Ä£Ê½,½¨ÔìÕßģʽ,Ô­ÐÍģʽ¡£

2¡¢½á¹¹ÐÍģʽ

ÖØµãΪ¡°¼Ì³Ð¡±¹ØÏµ£¬ÓÐ×ÅÒ»²ã¼Ì³Ð¹ØÏµ£¬ÇÒÒ»°ã¶¼ÓС°´úÀí¡±¡£

°üÀ¨£ºÊÊÅäÆ÷ģʽ,ÇŽÓģʽ,×éºÏģʽ,×°ÊÎÆ÷ģʽ,Íâ¹Ûģʽ,ÏíԪģʽ,´úÀíģʽ,¹ýÂËÆ÷ģʽ¡£

3¡¢ÐÐΪÐÍģʽ

Ö°ÔðµÄ»®·Ö£¬¸÷×ÔΪÕþ£¬¼õÉÙÍⲿµÄ¸ÉÈÅ¡£

°üÀ¨£ºÃüÁîģʽ£¬½âÊÍÆ÷ģʽ£¬µü´úÆ÷ģʽ£¬ÖнéÕßģʽ£¬±¸Íü¼ģʽ£¬¹Û²ìÕßģʽ£¬×´Ì¬Ä£Ê½£¬²ßÂÔģʽ£¬Ä£°å·½·¨Ä£Ê½£¬·ÃÎÊÕßģʽ£¬ÔðÈÎÁ´Ä£Ê½¡£

ǰ¶Ë³£ÓõļÆÄ£Ê½Ó¦ÓÃʵÀý

1¡¢µ¥Àýģʽ

µ¥ÀýģʽÓÖ³ÆÎªµ¥Ìåģʽ£¬±£Ö¤Ò»¸öÀàÖ»ÓÐÒ»¸öʵÀý£¬²¢Ìṩһ¸ö·ÃÎÊËüµÄÈ«¾Ö·ÃÎʵ㡣һ¸ö¼«ÓпÉÄÜÖØ¸´³öÏֵġ°ÊµÀý¡±, Èç¹ûÖØ¸´´´½¨£¬½«»á²úÉúÐÔÄÜÏûºÄ¡£Èç¹û½èÖúµÚÒ»´ÎµÄʵÀý£¬ºóÐøÖ»ÊǶԸÃʵÀýµÄÖØ¸´Ê¹Óã¬ÕâÑù¾Í´ïµ½ÁËÎÒÃǽÚÊ¡ÐÔÄܵÄÄ¿µÄ¡£

È«¾Öµ¯´°ÊÇǰ¶Ë¿ª·¢ÖÐÒ»¸ö±È½Ï³£¹æµÄÐèÇó£¬Ò»°ãÇé¿öÏ£¬Í¬Ò»Ê±¼äÖ»»á´æÔÚÒ»¸öÈ«¾Öµ¯´°£¬ÎÒÃÇ¿ÉÒÔʵÏÖµ¥Àýģʽ£¬±£Ö¤Ã¿´ÎʵÀý»¯Ê±·µ»ØµÄʵ¼ÊÉÏÊÇͬһ¸ö·½·¨¡£

class MessageBox {
show() {
console.log("show");
}
hide() {}
static getInstance() {
if (!MessageBox.instance) {
MessageBox.instance = new MessageBox();
}
return MessageBox.instance;
}
}
let box3 = MessageBox.getInstance();
let box4 = MessageBox.getInstance();
console.log(box3 === box4); // true

ÉÏÃæÕâÖÖÊDZȽϳ£¼ûµÄµ¥ÀýģʽʵÏÖ£¬µ«ÊÇÕâÖÖ·½Ê½´æÔÚһЩ±×¶Ë¡£ÒòΪËüÐèÒªÈõ÷Ó÷½Á˽⵽ͨ¹ýMessage.getInstanceÀ´»ñÈ¡µ¥Àý¡£

ÓÖ»òÕß¼ÙÉèÐèÇó±ä¸ü£¬¿ÉÒÔͨ¹ý´æÔÚ¶þ´Îµ¯´°£¬ÔòÐèÒª¸Ä¶¯²»Éٵط½£¬ÒòΪMessageBox³ýÁËʵÏÖ³£¹æµÄµ¯´°Âß¼­Ö®Í⣬»¹ÐèÒª¸ºÔðά»¤µ¥ÀýµÄÂß¼­¡£

Òò´Ë£¬¿ÉÒÔ½«³õʼ»¯µ¥ÀýµÄÂß¼­µ¥¶Àά»¤£¬ÊµÏÖÒ»¸öͨÓõġ¢·µ»ØÄ³¸öÀà¶ÔÓ¦µ¥ÀýµÄ·½·¨¡£

function getSingleton(ClassName) {
let instance;
return () => {
if (!instance) {
instance = new ClassName();
}
return instance;
};
}
const createMessageBox = getSingleton(MessageBox);
let box5 = createMessageBox();
let box6 = createMessageBox();
console.log(box5 === box6);

ÕâÑù£¬Í¨¹ýcreateMessageBox·µ»ØµÄʼÖÕÊÇͬһ¸öʵÀý¡£Èç¹ûÔÚijЩ³¡¾°ÏÂÐèÒªÉú³ÉÁíÍâµÄʵÀý£¬Ôò¿ÉÒÔÖØÐÂÉú³ÉÒ»¸öcreateMessageBox·½·¨£¬»òÕßÖ±½Óµ÷ÓÃnew MessageBox()£¬ÕâÑù¾Í¶Ô֮ǰµÄÂß¼­²»»áÓÐÈκÎÓ°Ïì¡£

2¡¢¹¤³§Ä£Ê½

¹¤³§Ä£Ê½ÌṩÁËÒ»ÖÖ´´½¨¶ÔÏóµÄ·½·¨£¬¶ÔʹÓ÷½Òþ²ØÁ˶ÔÏóµÄ¾ßÌåʵÏÖϸ½Ú£¬²¢Ê¹ÓÃÒ»¸ö¹«¹²µÄ½Ó¿ÚÀ´´´½¨¶ÔÏó¡£

ǰ¶Ë±¾µØ´æ´¢Ä¿Ç°×î³£¼ûµÄ·½°¸¾ÍÊÇʹÓÃlocalStorage£¬ÎªÁ˱ÜÃâÔÚÒµÎñ´úÂëÖи÷ÖÖgetItemºÍsetItem£¬ÎÒÃÇ¿ÉÒÔ×öÒ»ÏÂ×î¼òµ¥µÄ·â×°¡£

let themeModel = {
name: "local_theme",
get() {
let val = localStorage.getItem(this.name);
return val && jsON.parse(val);
},
set(val) {
localStorage.setItem(this.name, jsON.stringify(val));
},
remove() {
localStorage.removeItem(this.name);
},
};
themeModel.get();
themeModel.set({ darkMode: true });

ÕâÑù£¬Í¨¹ýthemeModel±©Â¶µÄget¡¢set½Ó¿Ú£¬ÎÒÃÇÎÞÐèÔÙά»¤local_theme¡£µ«ÉÏÃæµÄ·â×°Ò²´æÔÚһЩ¿É¼ûµÄÎÊÌ⣬Èç¹ûÐèÒªÐÂÔö¶à¸ö name£¬ÄÇôÉÏÃæµÄÄ£°å´úÂëÐèÒªÖØÐÂд¶à±éÂð£¿ÎªÁ˽â¾öÕâ¸öÎÊÌ⣬ÎÒÃÇ¿ÉÒÔ´´½¨Model¶ÔÏóµÄÂß¼­½øÐзâ×°¡£

const storageMap = new Map()
function createStorageModel(key, storage = localStorage) {
// Ïàͬkey·µ»Øµ¥Àý
if (storageMap.has(key)) {
return storageMap.get(key);
}
const model = {
key,
set(val) {
storage.setItem(this.key, JSON.stringify(val););
},
get() {
let val = storage.getItem(this.key);
return val && JSON.parse(val);
},
remove() {
storage.removeItem(this.key);
},
};
storageMap.set(key, model);
return model;
}
const themeModel = createStorageModel('local_theme', localStorage)
const utmSourceModel = createStorageModel('utm_source', sessionStorage)

ÕâÑù£¬ÎÒÃǾͿÉÒÔͨ¹ýcreateStorageModelÕâ¸ö¹«¹²µÄ½Ó¿ÚÀ´´´½¨¸÷ÖÖ²»Í¬±¾µØ´æ´¢µÄ¶ÔÏ󣬶øÎÞÐè¹Ø×¢´´½¨¶ÔÏóµÄ¾ßÌåϸ½Ú¡£

3¡¢²ßÂÔģʽ

²ßÂÔģʽ£¬¿ÉÒÔÕë¶Ô²»Í¬µÄ״̬£¬¸ø³ö²»Í¬µÄËã·¨»òÕß½á¹û¡£½«²ã¼¶ÏàͬµÄÂß¼­·â×°³É¿ÉÒÔ×éºÏºÍÌæ»»µÄ²ßÂÔ·½·¨£¬¼õÉÙif...else´úÂ룬·½±ãÀ©Õ¹ºóÐø¹¦ÄÜ¡£

±íµ¥Ð£ÑéÊÇÎÒÃÇ×î³£¼ûµÄ³¡¾°ÁË£¬ÎÒÃÇÒ»°ã¶¼»áÏëµ½ÓÃif...elseÀ´Åжϡ£

function onFormSubmit(params) {
if (!params.name) {
return showError("ÇëÌîдêdzÆ");
}
if (params.name.length > 6) {
return showError("êdzÆ×î¶à6λ×Ö·û");
}
if (!/^1\d{10}$/.test(params.phone))
return showError("ÇëÌîдÕýÈ·µÄÊÖ»úºÅ");
}
// ...
sendSubmit(params)
}

½«ËùÓÐ×ֶεÄУÑ鹿Ôò¶¼¶ÑµþÔÚÒ»Æð£¬´úÂëÁ¿´ó£¬ÅŲéÎÊÌâÒ²ÊÇÒ»¸ö´óÂé·³¡£ÔÚÓö¼û´íÎóʱ£¬Ö±½Óͨ¹ý return Ìø¹ýÁ˺óÃæµÄÅжϣ»Èç¹ûÎÒÃÇÏ£ÍûÖ±½Óչʾÿ¸ö×ֶεĴíÎóÄØ£¬ÄÇô¸Ä¶¯µÄ¹¤×÷Á¿ÓÖ²»ÉÙ¡£

²»¹ý£¬ÔÚantd¡¢ELementUIµÈ¿ò¼ÜÊ¢ÐеÄÄê´ú£¬ÎÒÃÇÒѾ­²»ÔÙÐèҪдÕâЩ¸´ÔÓµÄ±íµ¥Ð£Ñ飬µ«ÊǶÔÓÚËûÃǵÄʵÏÖÔ­Àí£¬ÎÒÃÇ¿ÉÒÔ¼òµ¥Ä£Äâһϡ£


// ¶¨ÒåÒ»¸öУÑéµÄÀ࣬Ö÷Òª±©Â¶Á˹¹Ôì²ÎÊýºÍvalidateÁ½¸ö½Ó¿Ú
class Schema {
constructor(descriptor) {
this.descriptor = descriptor; // ´«È붨ÒåµÄУÑ鹿Ôò
}
// ²ð·Ö³öһЩ¸üͨÓõĹæÔò£¬±ÈÈçrequired(±ØÌî)¡¢len(³¤¶È)¡¢min/max(×îÖµ)µÈ£¬¿ÉÒÔ¾¡¿ÉÄܵظ´ÓÃ
handleRule(val, rule) {
const { key, params, message } = rule;
let ruleMap = {
required() {
return !val;
},
max() {
return val > params;
},
validator() {
return params(val);
},
};
let handler = ruleMap[key];
if (handler && handler()) {
throw message;
}
}
validate(data) {
return new Promise((resolve, reject) => {
let keys = Object.keys(data);
let errors = [];
for (let key of keys) {
const ruleList = this.descriptor[key];
if (!Array.isArray(ruleList) || !ruleList.length) continue;
const val = data[key];
for (let rule of ruleList) {
try {
this.handleRule(val, rule);
} catch (e) {
errors.push(e.toString());
}
}
}
if (errors.length) {
reject(errors);
} else {
resolve();
}
});
}
}
// ÉùÃ÷ÿ¸ö×ֶεÄУÑéÂß¼­
const descriptor = {
nickname: [
{ key: "required", message: "ÇëÌîдêdzÆ" },
{ key: "max", params: 6, message: "êdzÆ×î¶à6λ×Ö·û" },
],
phone: [
{ key: "required", message: "ÇëÌîдµç»°ºÅÂë" },
{
key: "validator",
params(val) {
return !/^1\d{10}$/.test(val);
},
message: "ÇëÌîдÕýÈ·µÄµç»°ºÅÂë",
},
],
};
// ¿ªÊ¼¶ÔÊý¾Ý½øÐÐУÑé
const validator = new Schema(descriptor);
const params = { nickname: "", phone: "123000" };
validator.validate(params).then(() => {
console.log("success");
}).catch((e) => {
console.log(e);
});

SchemaÖ÷Òª±©Â¶Á˹¹Ôì²ÎÊýºÍvalidateÁ½¸ö½Ó¿Ú£¬ÊÇÒ»¸öͨÓõŤ¾ßÀ࣬¶øparamsÊÇ±íµ¥Ìá½»µÄÊý¾ÝÔ´£¬Òò´ËÖ÷ÒªµÄУÑéÂß¼­Êµ¼ÊÉÏÊÇÔÚdescriptorÖÐÉùÃ÷µÄ¡£½«³£¼ûµÄУÑ鹿Ôò¶¼·ÅÔÚruleMapÖУ¬±È֮ǰ¸÷ÖÖ²»¿É¸´ÓõÄif..elseÅжϸüÈÝÒ×ά»¤ºÍµü´ú¡£

4¡¢×´Ì¬Ä£Ê½

״̬ģʽÔÊÐíÒ»¸ö¶ÔÏóÔÚÆäÄÚ²¿×´Ì¬¸Ä±äµÄʱºò¸Ä±äËüµÄÐÐΪ¡£×´Ì¬Ä£Ê½µÄ˼·ÊÇ£ºÊ×ÏÈ´´½¨Ò»¸ö״̬¶ÔÏó±£´æ×´Ì¬±äÁ¿£¬È»ºó·â×°ºÃÿÖÖ¶¯×÷¶ÔÓ¦µÄ״̬£¬È»ºó״̬¶ÔÏó·µ»ØÒ»¸ö½Ó¿Ú¶ÔÏó£¬Ëü¿ÉÒÔ¶ÔÄÚ²¿µÄ״̬Ð޸ĻòÕßµ÷Óá£

³£¼ûµÄʹÓó¡¾°£¬±ÈÈç¹ö¶¯¼ÓÔØ£¬°üº¬Á˳õʼ»¯¼ÓÔØ¡¢¼ÓÔØ³É¹¦¡¢¼ÓÔØÊ§°Ü¡¢¹ö¶¯¼ÓÔØµÈ״̬£¬ÈÎÒâʱ¼äËüÖ»»á´¦ÓÚÒ»ÖÖ״̬¡£


// ¶¨ÒåÒ»¸ö״̬»ú
class rollingLoad {
constructor() {
this._currentState = 'init'
this.states = {
init: { failed: 'error' },
init: { complete: 'normal' },
normal: { rolling: 'loading' },
loading: { complete: 'normal' },
loading: { failed: 'error' },
}
this.actions = {
init() {
console.log('³õʼ»¯¼ÓÔØ£¬´óloading')
},
normal() {
console.log('¼ÓÔØ³É¹¦£¬Õý³£Õ¹Ê¾')
},
error() {
console.log('¼ÓÔØÊ§°Ü')
},
loading() {
console.log('¹ö¶¯¼ÓÔØ')
}
// .....
}
} change(state) {
// ¸ü¸Äµ±Ç°×´Ì¬
let to = this.states[this._currentState][state]
if(to){
this._currentState = to
this.go()
return true
}
return false
}

go() {
this.actions[this._currentState]()
return this
}
}// ״̬¸ü¸ÄµÄ²Ù×÷
const rollingLoad = new rollingLoad()
rollingLoad.go()
rollingLoad.change('complete')
rollingLoad.change('loading')

ÕâÑù£¬ÎÒÃǾͿÉÒÔͨ¹ý״̬±ä¸ü£¬ÔËÐÐÏàÓ¦µÄº¯Êý£¬ÇÒ״̬֮¼ä´æÔÚÁªÏµ¡£ÄÇô£¬¿´ÆðÀ´ÊDz»ÊǺͲßÂÔģʽºÜÏñÄØ£¿Æäʵ²»È»£¬²ßÂÔÀàµÄ¸÷¸öÊôÐÔÖ®¼äÊÇÆ½µÈƽÐеģ¬ËüÃÇÖ®¼äûÓÐÈκÎÁªÏµ¡£¶ø×´Ì¬»úÖеĸ÷¸ö״̬֮¼ä´æÔÚÏ໥Çл»£¬ÇÒÊDZ»¹æ¶¨ºÃÁ˵ġ£

5¡¢·¢²¼-¶©ÔÄģʽ

·¢²¼¡ª¶©ÔÄģʽÓֽй۲ìÕßģʽ£¬Ëü¶¨Òå¶ÔÏó¼äµÄÒ»ÖÖÒ»¶Ô¶àµÄÒÀÀµ¹ØÏµ£¬µ±Ò»¸ö¶ÔÏóµÄ״̬·¢Éú¸Ä±äʱ£¬ËùÓÐÒÀÀµÓÚËüµÄ¶ÔÏó¶¼½«µÃµ½Í¨Öª¡£

·¢²¼¶©ÔÄģʽ´ó¸ÅÊÇǰ¶Ëͬѧ×îÊìϤµÄÉè¼ÆÄ£Ê½Ö®Ò»ÁË£¬³£¼ûµÄʼþ¼àÌýaddEventListener£¬¸÷ÖÖÊôÐÔ·½·¨onload¡¢onchange£¬vueÏìӦʽÊý¾Ý£¬×é¼þͨÐÅredux¡¢eventBusµÈ¡£

³£¼ûµÄ»ñÈ¡µÇ¼ÐÅÏ¢£¬¼ÙÉèÎÒÃÇ¿ª·¢Ò»¸öÉ̳ÇÍøÕ¾£¬ÍøÕ¾ÀïÓÐ header Í·²¿¡¢nav µ¼º½¡¢ÏûÏ¢ÁÐ±í¡¢¹ºÎï³µµÈÄ£¿é¡£

Õ⼸¸öÄ£¿éµÄäÖȾÓÐÒ»¸ö¹²Í¬µÄǰÌáÌõ¼þ£¬¾ÍÊDZØÐëÏÈÓà ajax Òì²½ÇëÇó»ñÈ¡Óû§µÄµÇ¼ÐÅÏ¢¡£

±ÈÈçÓû§µÄÃû×ÖºÍÍ·ÏñÒªÏÔʾÔÚ header Ä£¿éÀ¶øÕâÁ½¸ö×ֶζ¼À´×ÔÓû§µÇ¼ºó·µ»ØµÄÐÅÏ¢¡£Òì²½µÄÎÊÌâͨ³£Ò²¿ÉÒÔÓûص÷º¯ÊýÀ´½â¾ö£º

login.succ(function(data){
header.setAvatar( data.avatar); // ÉèÖà header Ä£¿éµÄÍ·Ïñ
nav.setAvatar( data.avatar ); // ÉèÖõ¼º½Ä£¿éµÄÍ·Ïñ
message.refresh(); // Ë¢ÐÂÏûÏ¢Áбí
cart.refresh(); // ˢйºÎï³µÁбí
});

ÎÒÃÇ»¹±ØÐëÁ˽â header Ä£¿éÀïÉèÖÃÍ·ÏñµÄ·½·¨½ÐsetAvatar¡¢¹ºÎﳵģ¿éÀïË¢Ðµķ½·¨½Ðrefresh£¬ÕâÖÖÇ¿ñîºÏÐÔ»áʹ³ÌÐò±äµÃ²»Ò×ÍØÕ¹¡£

ÄÇô»ØÍ·¿´¿´ÎÒÃǵķ¢²¼¡ª¶©ÔÄģʽ£¬ÕâÖÖģʽÏ£¬¶ÔÓû§ÐÅÏ¢¸ÐÐËȤµÄÒµÎñÄ£¿é¿ÉÒÔ×ÔÐж©ÔĵǼ³É¹¦µÄÏûϢʼþ¡£

µ±µÇ¼³É¹¦Ê±£¬µÇ¼ģ¿éÖ»ÐèÒª·¢²¼µÇ¼³É¹¦µÄÏûÏ¢£¬¶øÒµÎñ·½½ÓÊܵ½ÏûÏ¢Ö®ºó£¬¾Í»á¿ªÊ¼½øÐи÷×ÔµÄÒµÎñ´¦Àí£¬µÇ¼ģ¿é²¢²»¹ØÐÄÒµÎñ·½¾¿¾¹Òª×öʲô¡£

// ·¢²¼µÇ¼³É¹¦µÄÏûÏ¢
$.ajax( 'http://xxx.com?login', function(data){ // µÇ¼³É¹¦
login.trigger( 'loginSucc', data); // ·¢²¼µÇ¼³É¹¦µÄÏûÏ¢
});
// ¸÷Ä£¿é¼àÌýµÇ¼³É¹¦µÄÏûÏ¢
var header = (function(){ // header Ä£¿é
login.listen( 'loginSucc', function(data){
header.setAvatar( data.avatar );
});
return {
setAvatar: function( data ){
console.log( 'ÉèÖà header Ä£¿éµÄÍ·Ïñ' );
}
}
})();
var nav = (function(){ // nav Ä£¿é
login.listen( 'loginSucc', function( data ){
nav.setAvatar( data.avatar );
});
return {
setAvatar: function( avatar ){
console.log( 'ÉèÖà nav Ä£¿éµÄÍ·Ïñ' );
}
}
})();

·¢²¼¡ª¶©ÔÄģʽ¿ÉÒԹ㷺ӦÓÃÓÚÒì²½±à³ÌÖУ¬ÕâÊÇÒ»ÖÖÌæ´ú´«µÝ»Øµ÷º¯ÊýµÄ·½°¸¡£±ÈÈ磬ÎÒÃÇ¿ÉÒÔ¶©ÔÄajaxÇëÇóµÄerror¡¢succµÈʼþ¡£

»òÕßÈç¹ûÏëÔÚ¶¯»­µÄÿһ֡Íê³ÉÖ®ºó×öһЩÊÂÇ飬ÄÇÎÒÃÇ¿ÉÒÔ¶©ÔÄÒ»¸öʼþ£¬È»ºóÔÚ¶¯»­µÄÿһ֡Íê³ÉÖ®ºó·¢²¼Õâ¸öʼþ¡£

ÔÚÒì²½±à³ÌÖÐʹÓ÷¢²¼¡ª¶©ÔÄģʽ£¬ÎÒÃǾÍÎÞÐè¹ý¶à¹Ø×¢¶ÔÏóÔÚÒì²½ÔËÐÐÆÚ¼äµÄÄÚ²¿×´Ì¬£¬¶øÖ»ÐèÒª¶©ÔĸÐÐËȤµÄʼþ·¢Éúµã¡£

6¡¢µü´úÆ÷ģʽ

µü´úÆ÷ģʽÊÇÖ¸ÌṩһÖÖ·½·¨Ë³Ðò·ÃÎÊÒ»¸ö¾ÛºÏ¶ÔÏóÖеĸ÷¸öÔªËØ£¬¶øÓÖ²»ÐèÒª±©Â¶¸Ã¶ÔÏóµÄÄÚ²¿±íʾ¡£

µü´úÆ÷ģʽ¿ÉÒ԰ѵü´úµÄ¹ý³Ì´ÓÒµÎñÂß¼­ÖзÖÀë³öÀ´£¬ÔÚʹÓõü´úÆ÷ģʽ֮ºó£¬¼´Ê¹²»¹ØÐĶÔÏóµÄÄÚ²¿¹¹Ô죬Ҳ¿ÉÒÔ°´Ë³Ðò·ÃÎÊÆäÖеÄÿ¸öÔªËØ¡£

JS Ò²ÄÚÖÃÁ˶àÖÖ±éÀúÊý×éµÄ·½·¨ÈçforEach¡¢reduceµÈ¡£¶ÔÓÚÊý×éµÄÑ­»·´ó¼Ò¶¼Çá³µÊì·ÁË£¬ÔÚʵ¼Ê¿ª·¢ÖУ¬Ò²¿ÉÒÔͨ¹ýÑ­»·À´ÓÅ»¯´úÂë¡£

Ò»¸ö³£¼ûµÄ¿ª·¢³¡¾°ÊÇ£ºÍ¨¹ý ua Åжϵ±Ç°Ò³ÃæµÄÔËÐÐÆ½Ì¨£¬·½±ãÖ´Ðв»Í¬µÄÒµÎñÂß¼­£¬×î»ù±¾µÄд·¨µ±È»ÊÇif...else¡£

const PAGE_TYPE = {
app: "app", // app
wx: "wx", // ΢ÐÅ
tiktok: "tiktok", // ¶¶Òô
bili: "bili", // BÕ¾
kwai: "kwai", // ¿ìÊÖ
};
function getPageType() {
const ua = navigator.userAgent;
let pageType;
// ÒÆ¶¯¶Ë¡¢×ÀÃæ¶Ë΢ÐÅä¯ÀÀÆ÷
if (/xxx_app/i.test(ua)) {
pageType = app;
} else if (/MicroMessenger/i.test(ua)) {
pageType = wx;
} else if (/aweme/i.test(ua)) {
pageType = tiktok;
} else if (/BiliApp/i.test(ua)) {
pageType = bili;
} else if (/Kwai/i.test(ua)) {
pageType = kwai;
} else {
// ...
}
return pageType;
}

²Î¿¼²ßÂÔģʽµÄ˼·£¬ÎÒÃÇ¿ÉÒÔ¼õÉÙ·ÖÖ§ÅжϵijöÏÖ£¬½«Ã¿¸öƽ̨µÄÅжϲð·Ö³Éµ¥¶ÀµÄ²ßÂÔ:

function isApp(ua) {
return /xxx_app/i.test(ua);
}
function isWx(ua) {
return /MicroMessenger/i.test(ua);
}
function isTiktok(ua) {
return /aweme/i.test(ua);
}
function isBili(ua) {
return /BiliApp/i.test(ua);
}
function isKwai(ua) {
return /Kwai/i.test(ua);
}
let platformList = [
{ name: "app", validator: isApp },
{ name: "wx", validator: isWx },
{ name: "tiktok", validator: isTiktok },
{ name: "bili", validator: isBili },
{ name: "kwai", validator: isKwai },
];
function getPageType() {
// ÿ¸öƽ̨µÄÃû³ÆÓë¼ì²â·½·¨
const ua = navigator.userAgent;
// ±éÀú
for (let { name, validator } in platformList) {
if (validator(ua)) {
return name;
}
}
}

ÕâÑù£¬Õû¸ögetPageType·½·¨¾Í±äµÃ·Ç³£¼ò½à£º°´Ë³Ðò±éÀúplatformList£¬·µ»ØµÚÒ»¸öÆ¥ÅäÉÏµÄÆ½Ì¨Ãû³Æ×÷ΪpageType¡£

ÕâÑù¼´Ê¹ºóÃæÐèÒªÔö¼Ó»òÒÆ³ýƽ̨Åжϣ¬ÐèÒªÐ޸ĵĽö½öÒ²Ö»ÊÇplatformListÕâ¸öµØ·½¶øÒÑ¡£

µü´úÆ÷ģʽÊÇÒ»ÖÖÏà¶Ô¼òµ¥µÄģʽ£¬¼òµ¥µ½ºÜ¶àʱºòÎÒÃǶ¼²»ÈÏΪËüÊÇÒ»ÖÖÉè¼ÆÄ£Ê½¡£Ä¿Ç°µÄ¾ø´ó²¿·ÖÓïÑÔ¶¼ÄÚÖÃÁ˵ü´úÆ÷¡£

×ܽá

ÔÚ½«º¯Êý×÷ΪһµÈ¶ÔÏóµÄÓïÑÔÖУ¬ÓÐÐí¶àÐèÒªÀûÓöÔÏó¶à̬ÐÔµÄÉè¼ÆÄ£Ê½£¬ÕâЩģʽµÄ½á¹¹Óë´«Í³ÃæÏò¶ÔÏóÓïÑԵĽṹ´óÏྶͥ£¬Êµ¼ÊÉÏÒѾ­ÈÚÈëµ½ÁËÓïÑÔÖ®ÖУ¬ÎÒÃÇ¿ÉÄܾ­³£Ê¹ÓÃËüÃÇ£¬Ö»ÊDz»ÖªµÀËüÃǵÄÃû×Ö¶øÒÑ¡£

ÉîÈëÀí½âËûÃÇ£¬²¢ÓÐÒâʶµØÈ¥Ê¹ÓÃÉè¼ÆÄ£Ê½À´ÓÅ»¯´úÂ룬ÌáÉýЧÂÊ£¬Ê¹ÎÒÃǵÄϵͳÓиüºÃµÄÍØÕ¹ÐÔ²ÅÊÇÎÒÃÇ×·ÇóµÄ¡£

 

   
1564 ´Îä¯ÀÀ       27
Ïà¹ØÎÄÕÂ

ΪʲôҪ×ö³ÖÐø²¿Êð£¿
ÆÊÎö¡°³ÖÐø½»¸¶¡±£ºÎå¸öºËÐÄʵ¼ù
¼¯³ÉÓë¹¹½¨Ö¸ÄÏ
³ÖÐø¼¯³É¹¤¾ßµÄÑ¡Ôñ-×°ÔØ
 
Ïà¹ØÎĵµ

³ÖÐø¼¯³É½éÉÜ
ʹÓÃHudson³ÖÐø¼¯³É
³ÖÐø¼¯³ÉÖ®-ÒÀÀµ¹ÜÀí
IPD¼¯³É²úÆ·¿ª·¢¹ÜÀí
Ïà¹Ø¿Î³Ì

ÅäÖùÜÀí¡¢ÈÕ¹¹½¨Óë³ÖÐø¼¯³É
Èí¼þ¼Ü¹¹Éè¼Æ·½·¨¡¢°¸ÀýÓëʵ¼ù
µ¥Ôª²âÊÔ¡¢Öع¹¼°³ÖÐø¼¯³É
»ùÓÚAndroidµÄµ¥Ôª¡¢ÐÔÄܲâÊÔ
×îл¼Æ»®
DeepSeekÔÚÈí¼þ²âÊÔÓ¦ÓÃʵ¼ù 4-12[ÔÚÏß]
DeepSeek´óÄ£ÐÍÓ¦Óÿª·¢Êµ¼ù 4-19[ÔÚÏß]
UAF¼Ü¹¹ÌåϵÓëʵ¼ù 4-11[±±¾©]
AIÖÇÄÜ»¯Èí¼þ²âÊÔ·½·¨Óëʵ¼ù 5-23[ÉϺ£]
»ùÓÚ UML ºÍEA½øÐзÖÎöÉè¼Æ 4-26[±±¾©]
ÒµÎñ¼Ü¹¹Éè¼ÆÓ뽨ģ 4-18[±±¾©]
 
×îÐÂÎÄÕÂ
iPersonµÄ¹ý³Ì¹Û£ºÒª ¹ý³Ì or ½á¹û
¡°ÒÔÈËΪ±¾¡±µÄ¹¤³ÌÕÜѧ
ÆóÒµ¼Ü¹¹¡¢TOGAFÓëArchiMate¸ÅÀÀ
UML ͼ½â£ºË³Ðòͼ£¨ sequence diagram £©
UML ͼ½â£º¶ÔÏóͼ£¨ class diagram £©
×îпγÌ
»ùÓÚUMLºÍEA½øÐÐϵͳ·ÖÎöÉè¼Æ
UML+EA+ÃæÏò¶ÔÏó·ÖÎöÉè¼Æ
»ùÓÚSysMLºÍEA½øÐÐϵͳÉè¼ÆÓ뽨ģ
UML + ǶÈëʽϵͳ·ÖÎöÉè¼Æ
ÁìÓòÇý¶¯µÄ½¨Ä£ÓëÉè¼Æ
³É¹¦°¸Àý
ijµçÐÅÔËÓª¹©Ó¦ÉÌ Ó¦ÓÃUML½øÐÐÃæÏò¶ÔÏó·ÖÎö
·é»ðͨÐÅ UML½øÐÐÃæÏò¶ÔÏóµÄ·ÖÎöÉè¼Æ
Î÷ÃÅ×Ó UMLÓëǶÈëʽÈí¼þ·ÖÎöÉè¼Æ
º½Ìì¿Æ¹¤Ä³×Ó¹«Ë¾ ´Óϵͳµ½Èí¼þµÄ·ÖÎö¡¢Éè¼Æ
ÉîÛÚijÆû³µÆóÒµ Ä£ÐÍÇý¶¯µÄ·ÖÎöÉè¼Æ