นักเรียนที่ใช้การค้นหา Baidu มักจะไม่เพิกเฉยต่อดัชนีดรอปดาวน์ของกล่องอินพุต สะดวกมาก อย่างไรก็ตามเงื่อนไขที่เป็นเอกลักษณ์ทำให้เทคโนโลยีแบบอะซิงโครนัสนี้ต้องเผชิญกับการทดสอบบางอย่าง คำขอเซิร์ฟเวอร์ที่เกิดขึ้นพร้อมกันสูงเรียกร้องให้มีการล้อมส่วนหน้าของพวกเขากระตุ้นให้พวกเขาลดจำนวนครั้งที่พวกเขาส่งอาแจ็กซ์ให้มากที่สุด ฟังดูไม่เหมือนเกี่ยวข้องกับบทความนี้ แต่ไม่ใช่ ก่อนอื่นมาทำโฆษณาฟรีสำหรับ Baidu ป้อนคำว่า "front-end" บนหน้าแรกของ Baidu และใช้ Chromebug เพื่อดูการตอบกลับที่ส่งได้อย่างง่ายดาย ผลลัพธ์มีดังนี้:
การคัดลอกรหัสมีดังนี้:
window.bdsug.sug ({q: 'front end';, p: false, s: ['การพัฒนาส่วนหน้า', 'วิศวกรปลายด้านหน้า', 'รถบัสปลายด้านหน้า', 'วิศวกรพัฒนาด้านหน้า', 'เฟรมเวิร์กส่วนหน้า', 'ความถี่รถบัสส่วนหน้า', 'คำถามสัมภาษณ์ส่วนหน้า'
Baidu พยายามที่จะแสดงข้อมูลแบบดึงลงโดยการคืนวิธี SUG ด้วยพารามิเตอร์ OBJ เมื่อคุณป้อน "front-end" อีกครั้งโดยไม่ต้องรีเฟรชหน้าจะไม่เกิดคำขอที่คล้ายกัน ซึ่งหมายความว่าพวกเขามีแนวโน้มที่จะสร้างวัตถุแคชซึ่งใช้ในการจัดเก็บวัตถุที่ร้องขอชั่วคราว เมื่อป้อนคำเดียวกันในภายหลังคีย์ของวัตถุแคชจะถูกเรียกคืนก่อน หลังจากการแข่งขันสำเร็จค่าของวัตถุจะถูกอ่านโดยตรงและไม่ส่งคำขอไปยังเซิร์ฟเวอร์อีกต่อไปซึ่งสามารถประหยัดค่าใช้จ่ายได้อย่างมีประสิทธิภาพ
ลองโยนอิฐและนำหยกมาพูดคุยเกี่ยวกับตัวเอกที่แท้จริง: วิธี HasownProperty
ฉันเชื่อว่า JSers ไม่คุ้นเคยกับ HasownProperty และฉันแค่ขายน้ำริมแม่น้ำที่นี่
มันเป็นเอกสิทธิ์ของวัตถุที่ใช้เพื่อตรวจสอบว่ามีคุณสมบัติอยู่ในคีย์ของวัตถุหรือไม่และค่าส่งคืนเป็นค่าบูลีนหรือไม่ นี่คือตัวอย่าง:
การคัดลอกรหัสมีดังนี้:
var test0 = array.prototype.hasownproperty ('แยก'); // false เนื่องจากวิธีการแยกไม่มีอยู่ในอาร์เรย์
var test1 = string.prototype.hasownproperty ('แยก'); // จริงเพราะการแยกเป็นวิธีการในตัวสำหรับวัตถุสตริง
เมื่อคุณรู้เรื่องนี้ดูเหมือนว่ามันไม่เพียงพอที่จะเห็นพลังของ HasownProperty ดังนั้นลองทำซ้ำตัวอย่างของ Baidu Pull-Down:
การคัดลอกรหัสมีดังนี้:
var data = {}, saveobj = function (val) {
if (data.hasownproperty (val)) {// หากค่าที่ส่งอยู่ในวัตถุข้อมูลจะไม่มีการร้องขอจะถูกส่ง
var len = data [val] .length;
สำหรับ (var i = 0; i <len; i ++) {
console.log (ข้อมูล [val] [i]);
-
}อื่น{
var url = 'http://suggestion.baidu.com/su?wd=' + val;
$ .ajax ({// เพื่อประโยชน์ที่ชัดเจนที่นี่เราใช้ Ajax ของ JQuery เป็นตัวอย่าง
url: url + '& p = 3 & cb = window.bdsug.sug & sid = 1421_1513_1541_1542_1582 & t = 1353756355137'
ข้อมูล: 'JSONP',
ประเภท: 'รับ',
ความสำเร็จ: ฟังก์ชั่น (res) {
var msg = res.data, len = msg.length;
msg == null && (msg = []);
ถ้า (len> 0) {
ข้อมูล [val] = msg; // ผลการค้นหาแคช
สำหรับ (var i = 0; i <len; i ++) {
console.log (msg [i]); // พิมพ์ผลการร้องขอ
-
-
}, ข้อผิดพลาด: function () {
การแจ้งเตือน ('ข้อผิดพลาด');
-
-
-
-
เพื่อนร่วมงานบางคนตั้งคำถามว่าด้วยวิธีนี้หน่วยความจำที่ถูกครอบครองโดยข้อมูลวัตถุแคชจะมีขนาดใหญ่ขึ้นเรื่อย ๆ เมื่อเก็บค่าคีย์ จากนั้นฉันอยากจะบอกว่านี่เป็นสิ่งที่หลีกเลี่ยงไม่ได้ เพื่อบันทึกคำขอเซิร์ฟเวอร์ผู้อื่นจะต้องเสียสละ ในความเป็นจริงพื้นที่ที่ครอบครองโดยวัตถุแคชมักจะเล็กน้อยเพราะมันไม่ใช่ "หน่วยความจำผู้อยู่อาศัย" และมันจะถูกทำลายเมื่อหน้าถูกรีเฟรช อย่างไรก็ตามเราสามารถให้ทางออกอื่นเพื่อยอมรับค่าสูงสุดสำหรับวัตถุนี้ตัวอย่างเช่นมันอนุญาตให้จัดเก็บคู่คีย์ค่า 100 คู่ได้มากที่สุด เมื่อจำนวนเกิน 100 ปุ่มที่เก็บไว้สิบปุ่มแรกจะถูกลบผ่านตัวดำเนินการลบหรือไม่เก็บไว้ดังนั้นปัญหานี้สามารถหลีกเลี่ยงได้
วิธี HasownProperty เป็นเรื่องธรรมดาในการตรวจจับวัตถุ แน่นอนว่านักเรียนที่สนใจสามารถเรียนรู้เกี่ยวกับวิธีการอสังหาริมทรัพย์ มันเป็นเวอร์ชันที่ได้รับการปรับปรุงของ HasownProperty มันสามารถตรวจจับคุณสมบัติของตัวเองและการแจงนับของคุณสมบัติ บทความนี้จะไม่อธิบายรายละเอียด