คำถามสัมภาษณ์งาน.js
1. ชนิดข้อมูล js
ประเภทข้อมูลพื้นฐาน หมายเลข สตริง บูลีน ค่า Null ไม่ได้กำหนด สัญลักษณ์ bigInt ประเภทข้อมูลอ้างอิง ออบเจ็กต์ อาร์เรย์ วันที่ ฟังก์ชัน RegExp2. การปรับปรุงการประกาศตัวแปรและฟังก์ชัน js
ใน js การประกาศตัวแปรและฟังก์ชันจะถูกเลื่อนขึ้นไปด้านบน ฟังก์ชันการดำเนินการจะถูกเลื่อนให้สูงกว่าตัวแปร ฟังก์ชันที่ไม่ระบุชื่อจะไม่ถูกยกขึ้น3. การปิด
การปิดเป็นฟังก์ชันที่สามารถอ่านตัวแปรภายในของฟังก์ชันอื่นๆ ได้ การปิดนั้นเป็นฟังก์ชันที่ส่งคืนฟังก์ชัน ข้อดี: สามารถอ่านตัวแปรภายในฟังก์ชันและเก็บตัวแปรไว้ในหน่วยความจำได้ วิธีการส่วนตัวของวัตถุ ข้อเสีย: การใช้หน่วยความจำที่ไม่เหมาะสมอาจทำให้เกิดปัญหาหน่วยความจำล้นได้4. ความแตกต่างระหว่าง == และ ===
== เท่ากันในแง่ที่ไม่เข้มงวด หากค่าเท่ากัน ก็เท่ากับ === เท่ากันในแง่ที่เข้มงวด ที่อยู่จะเท่ากันก็ต่อเมื่อเท่ากัน5. นี้
สิ่งนี้ชี้ไปที่ผู้เรียกโดยตรงของฟังก์ชันเสมอ หากมีคีย์เวิร์ดใหม่ สิ่งนี้จะชี้ไปที่ออบเจ็กต์ที่มาจากสิ่งใหม่ ในเหตุการณ์ สิ่งนี้จะชี้ไปที่ออบเจ็กต์ที่ทริกเกอร์เหตุการณ์6. วิธีสำรวจอาร์เรย์และอ็อบเจ็กต์ js
สำหรับข้อมูลแต่ละอย่างสำหรับ-ของ7. ความแตกต่างระหว่างแผนที่และ forEach
เมธอด forEach เป็นเมธอดพื้นฐานที่สุด ซึ่งก็คือการข้ามผ่านและการวนซ้ำ มีพารามิเตอร์สามตัวที่ส่งผ่านตามค่าเริ่มต้น: รายการเนื้อหาอาร์เรย์ที่สำรวจ ดัชนีอาร์เรย์ และวิธีการอาร์เรย์ที่สำรวจปัจจุบัน การใช้งานพื้นฐานจะเหมือนกับ forEach แต่แตกต่างออกไป มันจะส่งคืนอาร์เรย์ใหม่ ดังนั้นการเรียกกลับจะต้องมีค่าที่ส่งคืน หากไม่ใช่ ระบบจะส่งคืนค่าที่ไม่ได้กำหนด8. ฟังก์ชั่นลูกศรและฟังก์ชั่นธรรมดาแตกต่างกันอย่างไร?
อ็อบเจ็กต์นี้ในเนื้อความของฟังก์ชันคืออ็อบเจ็กต์ที่กำหนดไว้ ไม่ใช่อ็อบเจ็กต์ที่ใช้ ไม่สามารถใช้เป็นตัวสร้างได้ กล่าวคือ ไม่สามารถใช้คำสั่งใหม่ได้ มิฉะนั้นจะเกิดข้อผิดพลาด โยนวัตถุอาร์กิวเมนต์ไม่สามารถใช้งานได้ หากคุณต้องการใช้ คุณสามารถใช้พารามิเตอร์ Rest แทนได้ ไม่สามารถใช้คำสั่ง Yield ได้ ดังนั้นจึงไม่สามารถใช้ฟังก์ชันลูกศรเป็นฟังก์ชัน Generator ได้9. กลยุทธ์ต้นกำเนิดเดียวกัน
ความคล้ายคลึงหมายถึงชื่อโดเมน โปรโตคอล และหมายเลขพอร์ตเดียวกัน10. วิธีแก้ปัญหาข้ามโดเมน
jsonp ข้ามโดเมน document.domain + iframe ข้ามโดเมน nodejs มิดเดิลแวร์พร็อกซี แบ็กเอนด์ข้ามโดเมน ตั้งชื่อโดเมนที่ปลอดภัยในข้อมูลส่วนหัว11. ข้อจำกัดของโหมดเข้มงวด
ต้องประกาศตัวแปรก่อนใช้ฟังก์ชัน พารามิเตอร์ไม่สามารถมีแอตทริบิวต์ที่มีชื่อเดียวกันได้ มิฉะนั้น ข้อผิดพลาดจะถูกรายงานเพื่อป้องกันไม่ให้สิ่งนี้ชี้ไปที่วัตถุส่วนกลาง12. ใหม่ใน es6
ฟังก์ชันลูกศรสตริงเทมเพลตใหม่ for-of (ใช้เพื่อสำรวจข้อมูล เช่น ค่าในอาร์เรย์) ES6 รวมออบเจ็กต์ Promise ไว้ในข้อกำหนดและจัดเตรียมออบเจ็กต์ Promise ดั้งเดิม เพิ่มคำสั่ง la และ const สำหรับการประกาศตัวแปร นอกจากนี้ยังมีการแนะนำแนวคิดของโมดูลโมดูลด้วย13. คุณสมบัติและคุณสมบัติต่างกันอย่างไร?
คุณลักษณะคือแอตทริบิวต์ที่องค์ประกอบ dom มีเป็นแท็ก html ในเอกสาร คุณสมบัติคือแอตทริบิวต์ที่องค์ประกอบ dom มีเป็นวัตถุใน js สำหรับแอตทริบิวต์มาตรฐานของ html คุณลักษณะและคุณสมบัติจะถูกซิงโครไนซ์และจะได้รับการอัปเดตโดยอัตโนมัติ อย่างไรก็ตาม สำหรับแอตทริบิวต์ที่กำหนดเองจะไม่มีการซิงโครไนซ์14. Let และ Const ต่างกันอย่างไร?
ไม่มีการเลื่อนระดับตัวแปรในคำสั่ง Let หากใช้ก่อน Let จะมีการรายงานข้อผิดพลาด หากมีคำสั่ง Let และ Const ในพื้นที่บล็อก ขอบเขตปิดจะถูกสร้างขึ้นและไม่อนุญาตให้มีการประกาศซ้ำ และไม่สามารถแก้ไขได้ อย่างไรก็ตาม หากคำจำกัดความเป็น Object คุณสามารถแก้ไขข้อมูลภายในออบเจ็กต์ได้15. หน่วยความจำรั่ว
คำจำกัดความ: ปัญหาต่างๆ ที่เกิดจากโปรแกรมไม่ปล่อยหรือไม่สามารถปล่อยหน่วยความจำฮีปที่ได้รับการจัดสรรแบบไดนามิกในโปรแกรมด้วยเหตุผลบางประการ หน่วยความจำรั่วที่เป็นไปได้ใน js: ผลลัพธ์: การชะลอตัว ขัดข้อง ล่าช้ามาก ฯลฯ สาเหตุที่เป็นไปได้ของหน่วยความจำรั่วใน js เมื่อล้างตัวแปร dom ทั่วโลก ยังมีหน่วยความจำรั่วที่เกิดจากการมีอยู่ขององค์ประกอบลูกที่ไม่ถูกล้างโดย ตัวจับเวลาอ้างอิง16. จะแนะนำสคริปต์ได้อย่างไร?
html static <script> แนะนำการแทรกแบบไดนามิกของ js <script><script defer>: การโหลดแบบอะซิงโครนัส ดำเนินการหลังจากการแยกวิเคราะห์องค์ประกอบเสร็จสมบูรณ์ <script async>: การโหลดแบบอะซิงโครนัส แต่การแสดงผลองค์ประกอบจะถูกบล็อกระหว่างการดำเนินการ17. วิธีการอาร์เรย์
map: สำรวจอาร์เรย์และส่งกลับอาร์เรย์ใหม่ที่ประกอบด้วยค่าส่งคืนการเรียกกลับ forEach: ไม่สามารถแบ่งได้ คุณสามารถใช้ Throw new Error ใน try/catch เพื่อหยุด filter: Filter some: หากรายการใดรายการหนึ่งส่งคืน true ทั้งหมดจะเป็นจริงทุกรายการ: หากรายการหนึ่งส่งคืนค่าเท็จ ค่าโดยรวมจะเป็น falsejoin: สร้างสตริงโดยระบุตัวเชื่อมต่อ push/pop: push และ pop ที่ส่วนท้าย เปลี่ยนอาร์เรย์ดั้งเดิม ส่งคืนรายการ push/pop unshift/shift: push และ pop ที่ หัว, เปลี่ยนอาเรย์ดั้งเดิม, ส่งคืนการเรียงลำดับรายการการดำเนินการ (fn) / ย้อนกลับ: เรียงลำดับและย้อนกลับ, เปลี่ยนอาเรย์ดั้งเดิมที่เชื่อมต่อ: เชื่อมต่ออาเรย์โดยไม่ส่งผลกระทบต่ออาเรย์ดั้งเดิม, ชิ้นสำเนาตื้น ๆ (เริ่มต้น, สิ้นสุด): กลับ ตัดทอนอาร์เรย์ใหม่โดยไม่ต้องเปลี่ยนการประกบอาร์เรย์ดั้งเดิม (เริ่มต้น, หมายเลข, ค่า ...): ส่งคืนอาร์เรย์ที่ประกอบด้วยองค์ประกอบที่ถูกลบ, value คือรายการที่แทรก, เปลี่ยนอาร์เรย์ดั้งเดิม indexOf / LastIndexOf(value, fromIndex): ค้นหา รายการอาร์เรย์และส่งกลับตัวห้อยที่สอดคล้องกัน ลด / ลดขวา(fn(prev, cur), defaultPrev) : ดำเนินการเป็นคู่, prev คือค่าที่ส่งคืนของฟังก์ชันที่ทำให้ง่ายขึ้นล่าสุด, cur คือค่าปัจจุบัน (เริ่มจากรายการที่สอง)18. JavaScript คัดลอกลึกและตื้น?
สำเนาตื้น Object.assign สำเนาลึกสามารถแก้ไขได้โดย JSON.parse(JSON.stringify(object))19. พูดคุยเกี่ยวกับการใช้งานโปรแกรมอะซิงโครนัส?
ข้อดีของฟังก์ชันการโทรกลับ: ง่ายและเข้าใจง่าย ข้อเสีย: ไม่เอื้อต่อการบำรุงรักษา การมีเพศสัมพันธ์โค้ดสูง การตรวจสอบเหตุการณ์ ข้อดี: เข้าใจง่าย สามารถผูกหลายเหตุการณ์ แต่ละเหตุการณ์สามารถระบุฟังก์ชันการโทรกลับได้หลายรายการ ข้อเสีย: ขับเคลื่อนด้วยเหตุการณ์ กระบวนการไม่ได้ ชัดเจนเพียงพอสำหรับ release /Subscription (โหมดผู้สังเกตการณ์) คล้ายกับการฟังเหตุการณ์ แต่คุณสามารถใช้ 'ศูนย์ข้อความ' เพื่อทราบว่าขณะนี้มีผู้เผยแพร่และสมาชิกจำนวนเท่าใด ข้อดีของอ็อบเจ็กต์ Promise: คุณสามารถใช้เมธอด then เพื่อเขียนใน chain; คุณสามารถเขียนการเรียกกลับเมื่อเกิดข้อผิดพลาด ข้อเสียของฟังก์ชัน: ค่อนข้างยากที่จะเขียนและทำความเข้าใจข้อดีของฟังก์ชัน Generator: การแลกเปลี่ยนข้อมูลภายในและภายนอกตัวฟังก์ชัน, กลไกการจัดการข้อผิดพลาด ข้อเสีย: การจัดการกระบวนการที่ไม่สะดวก ข้อดีของฟังก์ชัน async: ตัวดำเนินการในตัว, ความหมายที่ดีกว่า , การบังคับใช้ที่กว้างขึ้น, ผลตอบแทนคืออะไร, โครงสร้างที่ชัดเจน ข้อเสีย: กลไกการจัดการข้อผิดพลาด20. พูดคุยเกี่ยวกับแนวคิดการเขียนโปรแกรมเชิงวัตถุ?
แนวคิดพื้นฐานคือการใช้แนวคิดพื้นฐาน เช่น อ็อบเจ็กต์ คลาส การสืบทอด และการห่อหุ้มเพื่อออกแบบโปรแกรม ข้อดีคือง่ายต่อการบำรุงรักษาและขยาย สามารถนำกลับมาใช้ใหม่ได้สูงและการสืบทอดงานการพัฒนา และลดภาระงานของการทำซ้ำ วงจรการพัฒนาสั้นลง21. การเพิ่มประสิทธิภาพการทำงานของโครงการ
ลดจำนวนคำขอ HTTP ใช้ CDN เพื่อหลีกเลี่ยงการโหลดแบบ Lazy ฯลฯ เพิ่มประสิทธิภาพ CSS Sprite ใช้ iconfont สำหรับการเผยแพร่หลายโดเมน แบ่งเนื้อหาออกเป็นชื่อโดเมนต่างๆ ให้มากที่สุด ลดการใช้ iframe หลีกเลี่ยง src รูปภาพที่ว่างเปล่า วางสไตล์ชีตในลิงก์ และใส่ JavaScript ที่ด้านล่าง ของหน้า22. เธรดเดี่ยวคืออะไรและความสัมพันธ์กับอะซิงโครนัสคืออะไร?
เธรดเดียว: มีเพียงเธรดเดียวเท่านั้นที่สามารถทำสิ่งเดียวเท่านั้น เหตุผล: เพื่อหลีกเลี่ยงความขัดแย้งในการแสดงผล DOM เบราว์เซอร์จำเป็นต้องแสดงผล DOMJS JS สองชิ้นและไม่สามารถดำเนินการได้ในเวลาเดียวกัน (ทั้งสองอย่างได้รับการแก้ไข) ข้อขัดแย้งของ DOM) ผู้ทำงานเว็บรองรับมัลติเธรด แต่ไม่สามารถเข้าถึงโซลูชัน DOM: แบบอะซิงโครนัส23. พูดคุยเกี่ยวกับการทำโหลดบาลานซ์?
เซิร์ฟเวอร์เดี่ยวทำงานร่วมกันเพื่อป้องกันไม่ให้เซิร์ฟเวอร์หนึ่งหรือสองสามเซิร์ฟเวอร์ทำงานหนักเกินไป และเพิ่มบทบาทของเซิร์ฟเวอร์ในการปรับสมดุลการโหลดการเปลี่ยนเส้นทาง http: ตัวกำหนดเวลาเลือกเซิร์ฟเวอร์ตามนโยบายเพื่อตอบสนองต่อคำขอด้วย 302 ข้อเสียคือ มีผลเฉพาะในครั้งแรกและการดำเนินการในภายหลัง รักษาสมดุลโหลด DNS บนเซิร์ฟเวอร์นี้: เมื่อแก้ไขชื่อโดเมน ให้เข้าถึงเซิร์ฟเวอร์ IP ตัวใดตัวหนึ่ง (ความสามารถในการตรวจสอบที่อ่อนแอ) เหตุผล - หลีกเลี่ยงข้อขัดแย้งในการแสดงผล DOM Reverse proxy load balancing: เข้าถึงเซิร์ฟเวอร์แบบรวม และเซิร์ฟเวอร์กำหนดเวลาการเข้าถึง เซิร์ฟเวอร์จริงต้องใช้เซิร์ฟเวอร์แบบรวม และประสิทธิภาพการทำงานจะได้รับผลกระทบจากจำนวนกลุ่มเซิร์ฟเวอร์24. ขอบเขตห่วงโซ่?
ลูกโซ่ขอบเขตสามารถเข้าใจได้ว่าเป็นชุดของรายการวัตถุ รวมถึงพาเรนต์และออบเจ็กต์ตัวแปรของมันเอง ดังนั้นเราจึงสามารถเข้าถึงตัวแปรหรือฟังก์ชันที่ประกาศในพาเรนต์ผ่านลูกโซ่ขอบเขต25. ต้นแบบ โซ่ต้นแบบ และมรดกคืออะไร?
ฟังก์ชั่นทั้งหมดมีแอตทริบิวต์ต้นแบบ (ต้นแบบ) วัตถุทั้งหมดมีแอตทริบิวต์ __proto__ ใน Javascript แต่ละฟังก์ชันจะมีแอตทริบิวต์ต้นแบบที่ชี้ไปที่ต้นแบบของตัวเอง และวัตถุที่สร้างโดยฟังก์ชันนี้ก็มีแอตทริบิวต์โปรโตที่ชี้ไปที่สิ่งนี้ด้วย ต้นแบบ และต้นแบบของฟังก์ชันก็คือวัตถุ ดังนั้นวัตถุนี้ก็จะมีโปรโตชี้ไปยังต้นแบบของตัวเองด้วย และสิ่งนี้จะลึกลงไปทีละชั้นจนกระทั่งต้นแบบของวัตถุ Object จึงสร้างห่วงโซ่ต้นแบบ26. กลไกการรวบรวมขยะ JS คืออะไร? 1. ภาพรวม
กลไกการรวบรวมขยะของ js คือการป้องกันการรั่วไหลของหน่วยความจำ (ชิ้นส่วนของหน่วยความจำที่ไม่จำเป็นอีกต่อไป) กลไกการรวบรวมขยะจะค้นหาตัวแปรเหล่านี้ที่ไม่ได้ใช้อีกต่อไปและปล่อยหน่วยความจำที่ชี้ไป ใน JS สภาพแวดล้อมการดำเนินการของ JS มีหน้าที่จัดการหน่วยความจำที่ใช้ระหว่างการเรียกใช้โค้ด
2. วงจรชีวิตของตัวแปร
เมื่อวงจรชีวิตของตัวแปรสิ้นสุดลง หน่วยความจำที่ตัวแปรชี้ไปจะถูกปล่อยออกมา JS มีตัวแปรสองประเภท ได้แก่ ตัวแปรภายในเครื่องและตัวแปรส่วนกลาง ตัวแปรภายในเครื่องจะมีผลกระทบต่อฟังก์ชันปัจจุบัน เมื่อฟังก์ชันสิ้นสุดลง ตัวแปรส่วนกลางจะถูกปล่อยออกมาจนกว่าเบราว์เซอร์จะถูกปิด
3. การรวบรวมขยะ js มีสองวิธี: การล้างเครื่องหมาย และการนับการอ้างอิง
ทำเครื่องหมายการกวาด: เบราว์เซอร์ส่วนใหญ่ใช้การรวบรวมขยะประเภทนี้ เมื่อตัวแปรเข้าสู่สภาพแวดล้อมการดำเนินการ (ประกาศตัวแปร) ตัวรวบรวมขยะจะทำเครื่องหมายตัวแปร เมื่อตัวแปรออกจากสภาพแวดล้อม จะถูกทำเครื่องหมายอีกครั้ง จากนั้นจึงลบ
การนับการอ้างอิง: วิธีนี้มักทำให้หน่วยความจำรั่วไหล ส่วนใหญ่ในเบราว์เซอร์เวอร์ชันต่ำกว่า กลไกของมันคือการติดตามจำนวนการอ้างอิงไปยังค่าใดค่าหนึ่ง เมื่อมีการประกาศตัวแปรและกำหนดประเภทการอ้างอิงให้กับตัวแปร จำนวนการอ้างอิงจะเพิ่มขึ้น 1 เมื่อตัวแปรชี้ไปที่ตัวแปรอื่น จำนวนการอ้างอิง จะลดลง 1 เมื่อเป็น 0 กลไกการรีไซเคิลจะเริ่มต้นขึ้น
27. การเจริญก้าวหน้าและการเสื่อมถอยอย่างสง่างาม
การปรับปรุงแบบก้าวหน้าจะสร้างเพจสำหรับเบราว์เซอร์เวอร์ชันต่ำเพื่อให้แน่ใจว่ามีฟังก์ชันพื้นฐานที่สุด จากนั้นจึงปรับปรุงเอฟเฟกต์ การโต้ตอบ และเพิ่มฟังก์ชันเพิ่มเติมสำหรับเบราว์เซอร์เวอร์ชันสูงเพื่อให้ได้รับประสบการณ์ผู้ใช้ที่ดียิ่งขึ้น ดาวน์เกรดอย่างสง่างาม: สร้างฟังก์ชันการทำงานที่สมบูรณ์ตั้งแต่ต้น และจากนั้นทำให้เข้ากันได้กับเบราว์เซอร์เวอร์ชันต่ำกว่าคำถามสัมภาษณ์วิว
1. ข้อดีของวิว
น้ำหนักเบา รวดเร็ว เรียนรู้ง่าย ข้อต่อต่ำ ใช้ซ้ำได้ การพัฒนาอย่างอิสระเอกสารครบถ้วนและเป็นภาษาจีน
2. องค์ประกอบหลักของ Vue ส่งข้อมูลไปยังส่วนประกอบย่อย
อุปกรณ์ประกอบฉาก3. ส่วนประกอบย่อยส่งผ่านเหตุการณ์ไปยังส่วนประกอบหลัก
$ปล่อย4. ประเด็นทั่วไปและความแตกต่างระหว่างคำสั่ง v-show และ v-if
จุดที่คล้ายกัน: ทั้งสองสามารถควบคุมการแสดงผลและการซ่อนองค์ประกอบ DOM
ข้อแตกต่าง: v-show จะเปลี่ยนเฉพาะแอตทริบิวต์ display องค์ประกอบ dom จะไม่หายไป และไม่จำเป็นต้องแสดงผลหน้าใหม่เมื่อสลับ
v-if จะลบองค์ประกอบ dom ออกจากเพจโดยตรง การสลับอีกครั้งจำเป็นต้องเรนเดอร์เพจอีกครั้ง
5. วิธีทำให้ CSS ใช้งานได้เฉพาะในองค์ประกอบปัจจุบันเท่านั้น
มีขอบเขต6. <keep-alive></keep-alive> มีหน้าที่อะไร
ส่วนใหญ่ใช้สำหรับส่วนประกอบแคชที่ต้องสลับบ่อยๆ โดยไม่ต้องเรนเดอร์เพจใหม่7. วิธีรับโดม
เพิ่ม ref='refname' ให้กับองค์ประกอบ dom จากนั้นรับองค์ประกอบ dom ผ่าน this.$refs.refname
8. ตั้งชื่อคำสั่งต่างๆ ใน Vue และการใช้งาน
v-รุ่น
v-on
v-html
v-ข้อความ
v-ครั้งเดียว
v-ถ้า
วีโชว์
9. vue-loader คืออะไร? มันใช้ทำอะไร?
ตัวโหลดสำหรับไฟล์ vue ที่แปลง template/js/style เป็นโมดูล js
วัตถุประสงค์: js สามารถเขียน es6 และสไตล์สไตล์ได้
10. ทำไมต้องใช้กุญแจ
เพิ่มคีย์เป็นตัวระบุที่ไม่ซ้ำกันให้กับแต่ละองค์ประกอบ DOM อัลกอริธึม diff สามารถระบุโหนดนี้ได้อย่างถูกต้องและทำให้การแสดงผลหน้าเว็บเร็วขึ้น11. axios และการติดตั้ง?
ปลั๊กอิน axios จำเป็นเมื่อใช้ ajax ในโปรเจ็กต์ vue
ดาวน์โหลดวิธีการ cnpm ติดตั้ง axios --save
12. การใช้ v-model
v-model ใช้สำหรับการผูกแบบฟอร์มแบบสองทางและสามารถแก้ไขข้อมูลได้แบบเรียลไทม์13. โปรดบอกฉันถึงการใช้งานของแต่ละโฟลเดอร์และไฟล์ในไดเร็กทอรี src ในโปรเจ็กต์ vue.cli
ส่วนประกอบเก็บส่วนประกอบ
ทางเข้าหน้าหลักของ app.vue
รายการไฟล์หลัก index.js
ass เก็บไฟล์ทรัพยากรแบบคงที่
14. อธิบายสถานการณ์การใช้งานของการคำนวณและการรับชมโดยย่อตามลำดับ
หากต้องการใช้ประโยคจากเว็บไซต์อย่างเป็นทางการ ทุกอย่างที่ต้องคำนวณควรใช้คุณสมบัติจากการคำนวณ เมื่อข้อมูลหลายชิ้นส่งผลต่อข้อมูลชิ้นเดียว ให้ใช้คุณสมบัติที่คำนวณแล้วใช้ตะกร้าสินค้าในฉาก
หากการเปลี่ยนแปลงข้อมูลส่งผลกระทบต่อข้อมูลหลายชิ้น ให้ใช้นาฬิกาและใช้ช่องค้นหาฉาก
15. v-on สามารถตรวจสอบได้หลายวิธีหรือไม่?
ใช่ เช่น v-on="onclick,onbure"16. การใช้ $nextTick
หลังจากแก้ไข data() แล้ว จะไม่สามารถรับข้อมูลที่แก้ไขในเพจได้ เมื่อใช้ $nextTick เมื่อข้อมูลในข้อมูลถูกแก้ไข เพจจะสามารถเรนเดอร์แบบเรียลไทม์ได้17. เหตุใดข้อมูลในองค์ประกอบ Vue จึงต้องเป็นฟังก์ชัน?
เนื่องจากคุณลักษณะของ JavaScript ในส่วนประกอบ ข้อมูลจึงต้องอยู่ในรูปแบบของฟังก์ชันและไม่สามารถเป็นอ็อบเจ็กต์ได้
ข้อมูลในส่วนประกอบถูกเขียนเป็นฟังก์ชัน และข้อมูลถูกกำหนดในรูปแบบของค่าส่งคืนฟังก์ชัน ดังนั้นทุกครั้งที่นำส่วนประกอบกลับมาใช้ใหม่ ข้อมูลใหม่จะถูกส่งกลับ ซึ่งเทียบเท่ากับแต่ละอินสแตนซ์ส่วนประกอบที่มีส่วนประกอบของตัวเอง พื้นที่ข้อมูลส่วนตัวและค่านิยม รับผิดชอบในการเก็บรักษาข้อมูลเป็นรายบุคคลโดยไม่ก่อให้เกิดความสับสน หากเพียงเขียนในรูปแบบออบเจ็กต์ อินสแตนซ์ส่วนประกอบทั้งหมดจะใช้ข้อมูลเดียวกัน ดังนั้นหากมีการเปลี่ยนแปลง รายการทั้งหมดจะถูกแก้ไข
18. ความเข้าใจในกรอบความก้าวหน้า
ผู้สนับสนุนให้น้อยที่สุด
สามารถเลือกระดับต่างๆ ได้ตามความต้องการที่แตกต่างกัน
19. Vue ใช้การเชื่อมโยงข้อมูลแบบสองทางอย่างไร?
การผูกข้อมูลแบบสองทางของ Vue จะดำเนินการผ่านการไฮแจ็คข้อมูล การรวมกัน และโหมดการสมัครสมาชิก กล่าวคือ ข้อมูลและมุมมองจะถูกซิงโครไนซ์ เมื่อข้อมูลเปลี่ยนแปลง มุมมองจะเปลี่ยนตามไปด้วย .
แกนหลัก: เกี่ยวกับการผูกข้อมูลแบบสองทางของ vue แกนหลักของมันคือเมธอด Object.defineProperty()
20. ความแตกต่างและข้อเสียระหว่างแอปพลิเคชันหน้าเดียวและแอปพลิเคชันหลายหน้า
แอปพลิเคชันหน้าเดียว (SPA) ในแง่ของคนธรรมดาหมายถึงแอปพลิเคชันที่มีหน้าหลักเพียงหน้าเดียว เบราว์เซอร์จะโหลด js, html และ css ทั้งหมดตั้งแต่เริ่มต้น เนื้อหาหน้าทั้งหมดมีอยู่ในหน้าหลักนี้ แต่ในขณะที่เขียน มันยังคงเขียนแยกกัน และเมื่อป้องกัน โปรแกรมการกำหนดเส้นทางจะถูกโหลดแบบไดนามิก การข้ามหน้าเดียว และรีเฟรชเฉพาะทรัพยากรในเครื่องเท่านั้น ส่วนใหญ่จะใช้งานบนพีซี
หลายหน้า (MPA) หมายความว่ามีหลายหน้าในแอปพลิเคชัน และทั้งหน้าจะถูกรีเฟรชเมื่อหน้าข้ามไป
ข้อดีของหน้าเดียว: ประสบการณ์ผู้ใช้นั้นดีและรวดเร็ว และการเปลี่ยนแปลงเนื้อหาไม่จำเป็นต้องโหลดทั้งหน้า ด้วยเหตุนี้ สปาจึงสร้างแรงกดดันต่อเซิร์ฟเวอร์น้อยลง ส่วนหน้าและส่วนหลังจะถูกแยกออกจากกัน และเอฟเฟกต์ของหน้าจะแยกจากกัน เย็นกว่า
ข้อเสียของหน้าเดียว: ไม่เอื้อต่อการทำ SEO; หากต้องนำทางคุณต้องรู้ไปข้างหน้าและข้างหลังด้วยตัวเอง การโหลดครั้งแรกใช้เวลานานมาก ความซับซ้อนของหน้าเพิ่มขึ้นมาก
21. เหตุใดจึงจำเป็นต้องเขียนคีย์ลงในองค์ประกอบรายการในโครงการ Vue และฟังก์ชันของมันคืออะไร? คีย์คือ ID ที่ไม่ซ้ำกันที่กำหนดให้กับแต่ละ vnode คุณสามารถพึ่งพาคีย์เพื่อรับโหนด vnode ที่เกี่ยวข้องใน oldVnode ได้แม่นยำและรวดเร็วยิ่งขึ้น
มันมีความแม่นยำมากขึ้นเพราะมีคีย์ไม่มีการใช้ซ้ำในสถานที่ จึงจะแม่นยำยิ่งขึ้น มันเร็วกว่าที่จะใช้เอกลักษณ์ของคีย์ในการสร้างวัตถุแผนที่เพื่อให้ได้โหนดที่สอดคล้องกันซึ่งเร็วกว่าวิธีการสำรวจ22. ลำดับการดำเนินการของ hooks วงจรชีวิตของส่วนประกอบหลักและส่วนประกอบย่อยคืออะไร?
โหลดกระบวนการเรนเดอร์parent beforeCreate -> สร้างพาเรนต์ -> พาเรนต์ beforeMount -> เด็ก beforeCreate -> สร้างเด็ก -> เด็ก beforeMount -> ติดตั้งเด็ก -> ติดตั้งพาเรนต์
กระบวนการอัพเดตส่วนประกอบย่อยผู้ปกครอง beforeUpdate -> เด็ก beforeUpdate -> อัปเดตเด็ก -> อัปเดตผู้ปกครอง
กระบวนการอัปเดตองค์ประกอบหลักผู้ปกครอง beforeUpdate -> อัปเดตผู้ปกครองแล้ว
กระบวนการทำลายล้างผู้ปกครอง beforeDestroy -> ลูก beforeDestroy -> เด็กถูกทำลาย -> ผู้ปกครองถูกทำลาย
23. บอกฉันเกี่ยวกับความเข้าใจของคุณเกี่ยวกับ nextTick? เมื่อคุณแก้ไขค่าของข้อมูลและรับค่าขององค์ประกอบ dom ทันที คุณจะไม่สามารถรับค่าที่อัปเดตได้ คุณต้องใช้การเรียกกลับ $nextTick เพื่อให้ค่าข้อมูลที่แก้ไขแสดงผลและอัปเดตเป็นองค์ประกอบ dom ก่อนที่จะรับได้สำเร็จ .
24. เหตุใดข้อมูลในส่วนประกอบ vue จึงต้องเป็นฟังก์ชัน? เนื่องจากคุณลักษณะของ JavaScript ในส่วนประกอบ ข้อมูลจะต้องมีอยู่ในรูปแบบของฟังก์ชันและไม่สามารถเป็นอ็อบเจ็กต์ได้ ข้อมูลในส่วนประกอบถูกเขียนเป็นฟังก์ชัน และข้อมูลถูกกำหนดในรูปแบบของค่าส่งคืนฟังก์ชัน ดังนั้นทุกครั้งที่นำส่วนประกอบกลับมาใช้ใหม่ ข้อมูลใหม่จะถูกส่งกลับ ซึ่งเทียบเท่ากับแต่ละอินสแตนซ์ส่วนประกอบที่มีส่วนประกอบของตัวเอง พื้นที่ข้อมูลส่วนตัว พวกเขารับผิดชอบเพียงการรักษาข้อมูลของตนเองโดยไม่ก่อให้เกิดความสับสน หากเพียงเขียนในรูปแบบออบเจ็กต์ อินสแตนซ์ของส่วนประกอบทั้งหมดจะใช้ข้อมูลเดียวกัน ดังนั้นการเปลี่ยนแปลงรายการใดรายการหนึ่งจะเป็นการเปลี่ยนแปลงทั้งหมด
25. ความแตกต่างระหว่าง vue และ jQuery jQuery ใช้ตัวเลือก ($) เพื่อเลือกอ็อบเจ็กต์ DOM และดำเนินการต่างๆ เช่น การกำหนด การได้มาซึ่งมูลค่า การโยงเหตุการณ์ เป็นต้น ที่จริงแล้ว ข้อแตกต่างเพียงอย่างเดียวจาก HTML ดั้งเดิมคือสามารถทำได้สะดวกกว่า เลือกและใช้งาน DOM ออบเจ็กต์ ในขณะที่ข้อมูลและอินเทอร์เฟซทำงานร่วมกัน ตัวอย่างเช่น หากคุณต้องการได้รับเนื้อหาของแท็กป้ายกำกับ: $("lable").val(); ยังคงขึ้นอยู่กับค่าขององค์ประกอบ DOM Vue แยกข้อมูลและดูผ่านออบเจ็กต์ Vue อย่างสมบูรณ์ ในการทำงานกับข้อมูล คุณไม่จำเป็นต้องอ้างอิงอ็อบเจ็กต์ DOM ที่เกี่ยวข้องอีกต่อไป อาจกล่าวได้ว่าข้อมูลและมุมมองถูกแยกออกจากกันผ่านอ็อบเจ็กต์ Vue ซึ่งก็คือ vm นี่คือ MVVM ในตำนาน
26. ความแตกต่างระหว่าง Delete และ Vue.delete ในการลบอาร์เรย์ Delete จะเปลี่ยนเฉพาะองค์ประกอบที่ถูกลบให้เป็นค่าว่าง/ไม่ได้กำหนดไว้ Vue.delete จะลบอาร์เรย์โดยตรงและเปลี่ยนค่าคีย์ของอาร์เรย์
27. วิธีแก้ปัญหาการโหลดหน้าจอแรกของ SPA ช้าโดยการติดตั้งปลั๊กอินที่จำเป็นสำหรับการโหลดแบบ Lazy Loading แบบไดนามิก
28. โปรเจ็กต์ Vue บรรจุไฟล์ js หนึ่งไฟล์ ไฟล์ css หนึ่งไฟล์ หรือหลายไฟล์หรือไม่ ตามข้อกำหนดนั่งร้าน vue-cli ไฟล์ js หนึ่งไฟล์และไฟล์ CSS หนึ่งไฟล์
29. วิธีการเรียกใช้การอัปเดตมุมมองเมื่อ vue อัปเดตอาร์เรย์ push();
30. วงจรชีวิตของวิวคืออะไร? มันทำอะไร? อินสแตนซ์ Vue แต่ละรายการจะต้องผ่านกระบวนการเริ่มต้นหลายชุดเมื่อถูกสร้างขึ้น ตัวอย่างเช่น จำเป็นต้องตั้งค่าการตรวจสอบข้อมูล คอมไพล์เทมเพลต ติดตั้งอินสแตนซ์กับ DOM และอัปเดต DOM เมื่อข้อมูลเปลี่ยนแปลง เป็นต้น ในขณะเดียวกัน ฟังก์ชันบางอย่างที่เรียกว่า life cycle hooks จะถูกเรียกใช้ในระหว่างกระบวนการนี้ด้วย ซึ่งทำให้ผู้ใช้สามารถเพิ่มโค้ดของตนเองในขั้นตอนต่างๆ ได้
31. hooks ใดที่จะถูกทริกเกอร์เมื่อโหลดเพจเป็นครั้งแรก? beforeCreate, สร้างแล้ว, beforeMount, mount
32. โดยทั่วไป Vue จะได้รับข้อมูลที่มีการสร้างฟังก์ชันช่วงเวลาก่อนเมาท์
33. ความแตกต่างระหว่างสร้างและเมานต์: สร้าง: ถูกเรียกก่อนที่เทมเพลตจะแสดงผลเป็น html นั่นคือค่าแอตทริบิวต์บางอย่างมักจะเตรียมใช้งานแล้วจึงแสดงผลในมุมมอง mount: เรียกหลังจากเทมเพลตถูกเรนเดอร์เป็น HTML โดยปกติแล้วหลังจากหน้าเริ่มต้นเสร็จสิ้น จากนั้นดำเนินการบางอย่างที่จำเป็นบนโหนด DOM ของ HTML
34. ความเข้าใจของวัฏจักรชีวิต Vue แบ่งออกเป็น 8 ขั้นตอน: ก่อน/หลังการสร้างก่อน/หลังการโหลดก่อน/หลังการอัปเดตและก่อน/หลังการทำลายล้าง ก่อน/หลังการสร้าง: ในขั้นตอน beforeCreated องค์ประกอบการติดตั้ง $el และข้อมูลอ็อบเจ็กต์ข้อมูลของอินสแตนซ์ vue ไม่ได้ถูกกำหนดไว้และยังไม่ได้เตรียมใช้งาน ในเฟสที่สร้างขึ้น ข้อมูลอ็อบเจ็กต์ข้อมูลของอินสแตนซ์ vue จะพร้อมใช้งาน แต่ $el จะพร้อมใช้งาน ก่อน/หลังการโหลด: ในขั้นตอนก่อนหน้านี้ $ EL และข้อมูลของอินสแตนซ์ VUE จะเริ่มต้น แต่โหนด DOM เสมือนก่อนที่จะยังคงติดตั้งและ Data.message ยังไม่ถูกแทนที่ ในเฟสที่เมาท์ อินสแตนซ์ vue จะถูกเมาท์และ data.message แสดงผลได้สำเร็จ ก่อน/หลังการอัปเดต: เมื่อข้อมูลเปลี่ยนแปลง วิธีการ beforeUpdate และอัปเดตจะถูกเรียกใช้ ก่อน/หลังการทำลาย: หลังจากดำเนินการตามวิธีการทำลาย การเปลี่ยนแปลงข้อมูลจะไม่ทริกเกอร์ฟังก์ชันเป็นระยะอีกต่อไป ซึ่งบ่งชี้ว่าอินสแตนซ์ Vue ได้เผยแพร่การตรวจสอบเหตุการณ์และการเชื่อมโยงกับ DOM แล้ว แต่โครงสร้าง DOM ยังคงมีอยู่
35.วูเอกซ์คืออะไร? การจัดการสถานะในกรอบงาน vue
36. วูเอ็กซ์มีคุณลักษณะอย่างไร? มีห้าประเภท ได้แก่ สถานะ Getter การกลายพันธุ์ การดำเนินการ สถานะของโมดูล: ข้อมูลพื้นฐาน (ตำแหน่งที่เก็บข้อมูลแหล่งข้อมูล) getters: การกลายพันธุ์ของข้อมูลที่ได้มาจากข้อมูลพื้นฐาน: วิธีการส่งข้อมูลที่เปลี่ยนแปลง การซิงโครไนซ์! การกระทำ: เช่นเดียวกับมัณฑนากร การห่อการกลายพันธุ์เพื่อให้สามารถไม่พร้อมกันได้ โมดูล: โมดูลาร์ Vuex
37. vue family bucket vue-cli, vuex, vueRouter, Axios
38. คำสั่ง npm ที่ใช้กันทั่วไปในโปรเจ็กต์ vue-cli คืออะไร?
การติดตั้ง npm คือคำสั่งเพื่อดาวน์โหลดแพ็คเกจทรัพยากร node_modules npm run dev คือคำสั่ง npm เพื่อเริ่มต้นสภาพแวดล้อมการพัฒนา vue-cli npm run build vue-cli คือคำสั่ง npm เพื่อสร้างทรัพยากรการปรับใช้สภาพแวดล้อมการทำงานจริง รายงานใช้เพื่อดูไฟล์ทรัพยากรการปรับใช้สภาพแวดล้อมการผลิต vue-cli ขนาด npm39. โปรดบอกจุดประสงค์ของแต่ละโฟลเดอร์และไฟล์ในโปรเจ็กต์ vue-cli หน่อยได้ไหม
โฟลเดอร์ build จะเก็บการกำหนดค่าเริ่มต้นของ webpack โฟลเดอร์ config จะบันทึกการกำหนดค่าการเริ่มต้นโปรเจ็กต์บางส่วน node_modules เป็นโมดูลที่โปรเจ็กต์ต้องโหลดโดย npm ไดเร็กทอรี src คือไดเร็กทอรีที่เราต้องการพัฒนา: สินทรัพย์ถูกใช้เพื่อวางส่วนประกอบรูปภาพ .vue เป็นไฟล์รายการโปรเจ็กต์ main.js ของไฟล์คอร์โปรเจ็กต์40. อะไรคือความแตกต่างระหว่าง V-IF และ V-show?
สิ่งที่เหมือนกัน: ทั้งหมดแสดงองค์ประกอบ DOM แบบไดนามิก ความแตกต่าง: v-if จะเพิ่มหรือลบองค์ประกอบ DOM ลงในแผนผัง DOM แบบไดนามิก หากสวิตช์มีการรวบรวมบางส่วน / ถอนการติดตั้งกระบวนการ ให้ทำลายและสร้างผู้ฟังเหตุการณ์ภายในและส่วนประกอบย่อยใหม่อย่างเหมาะสมในระหว่างกระบวนการสลับ v-show เป็นเพียงการใช้ประสิทธิภาพการสลับอย่างง่าย ๆ โดยยึดตาม css v-if มีต้นทุนการสลับที่สูงกว่า v-show ต้นทุนการเรนเดอร์เริ่มต้นที่สูงขึ้น สถานการณ์ v-if เหมาะสำหรับสภาพการทำงานที่ไม่น่าจะเปลี่ยนแปลง v-show เหมาะสำหรับการสลับบ่อยครั้ง41. ลำดับความสำคัญของ v-for และ v-if คืออะไร เมื่อใช้ v-for และ v-if พร้อมกัน จะมีลำดับความสำคัญในการทำงานต่อกัน if ซึ่งหมายความว่า v-for มีลำดับความสำคัญสูงกว่า v-if การตัดสินของ v-if จะถูกเรียกทุกครั้งในการมอบหมายแต่ละลูป ดังนั้นจึงไม่แนะนำให้ใช้ v-if และ v-for ในเวลาเดียวกัน ในฉลากเดียวกัน
42. ตัวดัดแปลงที่ใช้กันทั่วไปใน Vue ตัวดัดแปลงเหตุการณ์
.stop ป้องกันเหตุการณ์จากการเผยแพร่ต่อไป ป้องกันการป้องกันพฤติกรรมเริ่มต้นของ tags.capture ใช้โหมดการจับเหตุการณ์ นั่นคือ เหตุการณ์ที่ทริกเกอร์โดยองค์ประกอบเองจะถูกประมวลผลที่นี่ก่อน จากนั้นจึงส่งต่อไปยังองค์ประกอบภายในเพื่อการประมวลผลด้วยตนเองเท่านั้น เมื่อ event.target เป็นองค์ประกอบปัจจุบัน ฟังก์ชันตัวจัดการจะถูกทริกเกอร์เมื่อเหตุการณ์เกิดขึ้นเพียงครั้งเดียว Passive จะบอกเบราว์เซอร์ว่าคุณไม่ต้องการป้องกันพฤติกรรมเริ่มต้นของเหตุการณ์ตัวดัดแปลงสำหรับ V-model
.lazy ใช้ตัวแก้ไขนี้เพื่อซิงโครไนซ์อีกครั้งในเหตุการณ์การเปลี่ยนแปลง หมายเลขจะแปลงค่าอินพุตของผู้ใช้ให้เป็นประเภทตัวเลขโดยอัตโนมัติ จะกรองช่องว่างต่อท้ายที่ผู้ใช้ป้อนตัวดัดแปลงเหตุการณ์แป้นพิมพ์
.enter.tab.delete (บันทึกคีย์ "ลบ" และ "backspace") esc.space.up.down.left.rightตัวดัดแปลงระบบ
.ctrl.alt.shift.metaตัวดัดแปลงปุ่มเมาส์
.left.right.middle43. จะใช้วัตถุเหตุการณ์ในเหตุการณ์ vue ได้อย่างไร?
รับวัตถุเหตุการณ์และส่ง $event เป็นพารามิเตอร์วิธีการ โปรดทราบว่าสัญลักษณ์ $ ถูกใช้ในเหตุการณ์ <button @click="Event($event)">วัตถุเหตุการณ์</button>44. วิธีการถ่ายโอนค่าส่วนประกอบคืออะไร?
ส่งผ่านจากผู้ปกครองไปสู่เด็ก: องค์ประกอบลูกได้รับค่าของแอตทริบิวต์ xx ที่ส่งผ่านโดยองค์ประกอบหลักผ่านอุปกรณ์ประกอบฉาก ['xx'] ส่งผ่านจากเด็กไปยังผู้ปกครอง: ส่วนประกอบลูกผ่านผ่านสิ่งนี้ $ emit ('fnname' ค่า) และองค์ประกอบหลักจะได้รับกิจกรรม fnname วิธีอื่น ๆ ในการรับการโทรกลับ: โดยการสร้างบัสและค่าผ่านโดยใช้ vuex45. องค์ประกอบลูกเรียกองค์ประกอบหลักใน Vue อย่างไร?
เรียกเมธอดของคอมโพเนนต์พาเรนต์โดยตรงผ่าน this.$parent.event ในคอมโพเนนต์ลูก ใช้ $emit() ในองค์ประกอบลูกเพื่อทริกเกอร์เหตุการณ์ไปยังองค์ประกอบหลัก และองค์ประกอบหลักสามารถฟังเหตุการณ์นี้ได้ องค์ประกอบหลักส่งผ่านวิธีการไปยังองค์ประกอบลูก และวิธีการดังกล่าวจะถูกเรียกโดยตรงในองค์ประกอบลูก46. จะทำให้ CSS ใช้งานได้เฉพาะในคอมโพเนนต์ปัจจุบันได้อย่างไร? เพิ่มการกำหนดขอบเขตไว้ด้านหน้าสไตล์ในคอมโพเนนต์
47. วิธีรับ dom?ref="domName" การใช้งาน: this.$refs.domName
48. การข้ามเส้นทาง VUE
(1) ลิงค์เราเตอร์การนำทางที่ประกาศ
หากไม่มีพารามิเตอร์: // หมายเหตุ: หากลิงก์ในเราเตอร์ลิงก์เริ่มต้นด้วย '/' ลิงก์นั้นจะเริ่มต้นจากเส้นทางรูท หากไม่ได้ขึ้นต้นด้วย '/' ลิงก์นั้นจะเริ่มจากเส้นทางปัจจุบัน <router-link :to="{name:'home'}"> <router-link :to="{path:'/home'}"> // ยอมรับทั้งชื่อและเส้นทาง แนะนำให้ใช้ชื่อ ด้วยพารามิเตอร์: <router-link: to = "{name: 'home', params: {id: 1}}"> <Router-Link: to = "name: 'Home', Query: {id: 1} } "> <router-link: to ="/home/: id "> // transfer object <router-link: to =" {ชื่อ: 'รายละเอียด', คำถาม: {รายการ: json.stringify (obj)}}} "> </d-link>(2) this.$router.push()
ไม่มีพารามิเตอร์: สิ่งนี้ $ router.push ('/home') สิ่งนี้ $ router.push ({ชื่อ: 'home'}) สิ่งนี้ $ router.push ({path: '/home'}) พารามิเตอร์การสืบค้น 1 การกำหนดค่าการกำหนดเส้นทาง: ชื่อ: 'home', เส้นทาง: '/home' 2. กระโดด: this. $ router.push ({name: 'home', Query: {id: '1'}}) สิ่งนี้ $ เราเตอร์ ({path: '/home', แบบสอบถาม: {id: '1'}}) 3. : 'home', Path: '/home/: id' (หรือเส้นทาง: '/home: id') 2. กระโดด: this. $ router.push ({ชื่อ: 'home', params: {id: '1 '}}) หมายเหตุ: // คุณสามารถใช้ชื่อเพื่อจับคู่เส้นทางเท่านั้น และไม่สามารถใช้พาธ // พารามิเตอร์เพื่อส่งพารามิเตอร์ (คล้ายกับการโพสต์) พาธการกำหนดค่าการกำหนดเส้นทาง: "/home/:id" หรือพาธ: "/home :id " มิฉะนั้นพารามิเตอร์การรีเฟรชจะหายไป 3. รับพารามิเตอร์ html พารามิเตอร์: $route.params.id script parameter: this.$route.params.id ส่งพารามิเตอร์โดยตรงผ่านพาธ 1. การกำหนดค่าเส้นทาง: name: 'home', path : '/home/: id' 2. กระโดด: this. $ router.push ({path: '/home/123'}) หรือ: this. $ router.push ('/home/123') 3. รับพารามิเตอร์: ความแตกต่างระหว่าง this.$route.params.idparams และ Query นั้นคล้ายคลึงกันในการรับ หลังจากการข้าม URL ของเพจจะถูกต่อเข้ากับพารามิเตอร์ คล้ายกับ ?id=1 สิ่งที่ไม่สำคัญสามารถส่งผ่านเช่นนี้รหัสผ่านและสิ่งที่คล้ายกันยังคงใช้พารามิเตอร์และ ID จะยังคงอยู่ที่นั่นเมื่อหน้าถูกรีเฟรช พารามิเตอร์จะคล้ายกับการโพสต์ พารามิเตอร์จะไม่ถูกต่อกันหลัง URL ของหน้าหลังจากการกระโดด(3) this.$router.replace()
การใช้งานก็เหมือนกับข้างบน(4) this.$router.go(n)
ข้าม n หน้าไปข้างหน้าหรือข้างหลัง n อาจเป็นจำนวนเต็มบวกหรือลบก็ได้ความแตกต่าง:
this.$router.push ข้ามไปยังเส้นทาง URL ที่ระบุและเพิ่มบันทึกในสแต็กประวัติ การคลิกกลับจะกลับไปยังหน้าก่อนหน้า this.$router.replace ข้ามไปยังเส้นทาง URL ที่ระบุ แต่จะไม่มีบันทึกใน สแต็กประวัติ บันทึก คลิก Return เพื่อข้ามไปยังหน้าก่อนหน้า (นั่นคือ แทนที่หน้าปัจจุบันโดยตรง) this.$router.go(n) ข้ามไปข้างหน้าหรือข้างหลัง n หน้า n อาจเป็นจำนวนเต็มบวกหรือจำนวนเต็มลบ49. หลักการของการเชื่อมโยงสองทางของ Vue.js Vue.js 2.0 ใช้การไฮแจ็คข้อมูล (โหมดพร็อกซี) รวมกับโหมดผู้เผยแพร่-สมาชิก (โหมด PubSub) เพื่อแย่งชิงผู้ตั้งค่าและผู้ได้รับทรัพย์สินแต่ละรายการผ่าน Object.defineProperty() เผยแพร่ข้อความไปยังสมาชิกเมื่อข้อมูลเปลี่ยนแปลงและทริกเกอร์การโทรกลับเพื่อฟังที่เกี่ยวข้อง
แต่ละอินสแตนซ์ของส่วนประกอบมีอินสแตนซ์ของโปรแกรมเฝ้าดูที่สอดคล้องกัน ซึ่งจะบันทึกคุณสมบัติเป็นการขึ้นต่อกันในระหว่างการเรนเดอร์ส่วนประกอบ ในภายหลัง เมื่อมีการเรียกตัวตั้งค่าของการขึ้นต่อกัน ผู้เฝ้าดูจะได้รับแจ้งให้คำนวณใหม่ ทำให้ส่วนประกอบที่เกี่ยวข้องได้รับการอัปเดต
Vue.js 3.0 ละทิ้ง Object.defineProperty และใช้ ES6 Native Proxy ที่เร็วกว่า (เข้าถึงตัวดักวัตถุหรือที่เรียกว่าพรอกซี)
50. ความแตกต่างระหว่างคอมพิวเตอร์และนาฬิกา
แอตทริบิวต์ที่คำนวณได้: ขึ้นอยู่กับค่าแอตทริบิวต์อื่น ๆ และค่าที่คำนวณได้จะถูกแคช
ผู้ฟังดู: มันเป็นฟังก์ชั่นการสังเกตมากกว่าโดยไม่ต้องแคชคล้ายกับการตรวจสอบการโทรกลับของข้อมูลบางอย่าง
สถานการณ์การใช้งาน:
เมื่อเราจำเป็นต้องทำการคำนวณเชิงตัวเลขและพึ่งพาข้อมูลอื่น ๆ ควรใช้การคำนวณเนื่องจากคุณลักษณะแคชของการคำนวณสามารถใช้เพื่อหลีกเลี่ยงการคำนวณใหม่ทุกครั้งที่ได้รับค่า ควรใช้การดูเมื่อเราต้องการดำเนินการแบบอะซิงโครนัสหรือมีราคาแพงเมื่อมีการเปลี่ยนแปลงข้อมูล ผลลัพธ์สุดท้าย สิ่งเหล่านี้เป็นสิ่งที่คุณสมบัติที่คำนวณไม่สามารถทำได้ หากปัจจัยหลายอย่างส่งผลกระทบต่อการแสดงผลหนึ่งครั้งให้ใช้การคำนวณความแตกต่างระหว่างวิธีการคำนวณและวิธีการ
คำนวณ: คุณสมบัติที่คำนวณได้จะถูกแคชขึ้นอยู่กับการพึ่งพาของพวกเขาและจะได้รับการประเมินอีกครั้งเมื่อการพึ่งพาที่เกี่ยวข้องของพวกเขาเปลี่ยนไป51. ตัวกรอง
ใช้ตัวกรองใน Vue to Filter (รูปแบบ) ตัวกรอง แสดงสถานการณ์การใช้งาน: ตัวอย่างเช่นรูปแบบการแสดงที่ต้องดำเนินการตามเวลาตัวเลข ฯลฯ ;52. Axios เป็นไลบรารี HTTP ที่ใช้งานง่ายและมีประสิทธิภาพ
53. Sass คืออะไร? วิธีการติดตั้งและใช้ใน Vue? SASS เป็นภาษา CSS ที่รวบรวมไว้ล่วงหน้า
ใช้ NPM เพื่อติดตั้งตัวโหลด (SASS-Loader, CSS-Loader ฯลฯ Loaders) กำหนดค่า sass loader ใน webpack.config.js 54. หน้า Vue.js กะพริบ vue.js ให้คำสั่ง V-cloak ซึ่งยังคงอยู่ในองค์ประกอบจนกว่าการรวบรวมอินสแตนซ์ที่เกี่ยวข้องจะสิ้นสุด เมื่อใช้กับ CSS คำสั่งนี้จะซ่อนแท็กที่ไม่ได้รวบรวมไว้จนกว่าจะมีการรวบรวมอินสแตนซ์ การใช้งานมีดังนี้ [v-cloak] {แสดง: ไม่มี;55. วิธีการแก้ปัญหาโครงสร้างลำดับชั้นของข้อมูลที่ลึกเกินไป คุณสามารถใช้ vm. $ set ด้วยตนเองกำหนดเลเยอร์ของข้อมูล: vm. $ set ("Demo", ABCD)
56. VUE คำแนะนำทั่วไป
V-model ส่วนใหญ่จะใช้สำหรับองค์ประกอบแบบฟอร์มเพื่อใช้การเชื่อมโยงข้อมูลแบบสองทาง (เหมือนกับ NG-Model ในเชิงมุม) ฟังก์ชั่นการเชื่อมโยงแบบไดนามิก V-bind: เปลี่ยนข้อมูลในหน้า V-ON: คลิกผูกฟังก์ชันกับฉลากในเวลาที่เหมาะสม ซึ่งสามารถย่อเป็น @ตัวอย่างเช่นในการผูกฟังก์ชันคลิกฟังก์ชันจะต้องเขียนในวิธีการรูปแบบ v-for: v-for = "ชื่อฟิลด์ใน (ของ) Array json" array หรือ JSON (เช่นเดียวกับ NG-repeat ใน Angular) เนื้อหาการแสดง V-show (เช่นเดียวกับ NG-show ใน Angular) V-hide ซ่อนเนื้อหา (เหมือนกับ NG-hide ใน Angular) V-IF แสดงและซ่อน (การลบและการเพิ่มองค์ประกอบ DOM เหมือนกัน ในฐานะที่เป็น ng-if ในเชิงมุมค่าเริ่มต้นเป็นเท็จ) V- else-if จะต้องใช้ร่วมกับ v-if v-else ต้องใช้ร่วมกับ V-IF และไม่สามารถใช้เพียงอย่างเดียวมิฉะนั้นจะมีข้อผิดพลาด รายงานการรวบรวมเทมเพลตข้อผิดพลาด v-text ข้อความวิเคราะห์ข้อความ v-html แยกวิเคราะห์ html แท็ก v-bind: คลาสวิธีการรวมสามวิธีวัตถุประเภท '{สีแดง: isred}' ternary type'isred? "red": "blue" สีแดง: "isred"}, {blue: "isblue"}] 'v-once เท่านั้นแสดงผลเพียงครั้งเดียวเมื่อเข้าสู่หน้าไม่แสดง V-cloak อีกต่อไป57. ความแตกต่างระหว่าง $ Route และ $ เราเตอร์
$ Route เป็น "วัตถุข้อมูลการกำหนดเส้นทาง" รวมถึงเส้นทาง, พารามิเตอร์, แฮช, แบบสอบถาม, เต็มรูปแบบ, การจับคู่, ชื่อและพารามิเตอร์ข้อมูลการกำหนดเส้นทางอื่น ๆ $ เราเตอร์เป็นวัตถุ "อินสแตนซ์การกำหนดเส้นทาง" รวมถึงวิธีการกระโดดเส้นทางฟังก์ชั่นเบ็ด ฯลฯ58. วิธีทำความเข้าใจการไหลของข้อมูลเดียวของ Vue
ข้อมูลจะถูกส่งผ่านจากองค์ประกอบหลักไปยังส่วนประกอบลูกเสมอ สิ่งนี้จะป้องกันไม่ให้องค์ประกอบของเด็กเปลี่ยนสถานะขององค์ประกอบหลักโดยไม่ตั้งใจทำให้การไหลของข้อมูลของแอปพลิเคชันของคุณยากที่จะเข้าใจ หมายเหตุ: การใช้ V-model โดยตรงเพื่อผูกอุปกรณ์ประกอบฉากที่ส่งผ่านจากองค์ประกอบหลักไปยังองค์ประกอบเด็กเป็นวิธีการเขียนที่ผิดปกติและสภาพแวดล้อมการพัฒนาจะรายงานคำเตือน หากคุณต้องการเปลี่ยนค่าอุปกรณ์ประกอบฉากขององค์ประกอบหลักคุณสามารถกำหนดตัวแปรในข้อมูลเริ่มต้นด้วยค่า Prop แล้วใช้ $ EMIT เพื่อแจ้งส่วนประกอบพาเรนต์เพื่อแก้ไข59. เสมือนจริงคืออะไร? ข้อดีและข้อเสียคืออะไร? เพราะการจัดการ DOM ในเบราว์เซอร์มีราคาแพง การดำเนินการบ่อยครั้งใน DOM จะทำให้เกิดปัญหาประสิทธิภาพบางอย่าง นี่คือเหตุผลในการสร้าง DOM เสมือนจริง DOM เสมือนของ Vue2 ดึงการใช้งานของห้องสมุดโอเพนซอร์ส Snabbdom สาระสำคัญของ DOM เสมือนคือการใช้วัตถุ JS ดั้งเดิมเพื่ออธิบายโหนด DOM ซึ่งเป็นเลเยอร์ของนามธรรมของ DOM จริง
ข้อดี: 1. การรับประกันประสิทธิภาพที่ต่ำกว่า: DOM เสมือนของเฟรมเวิร์กจำเป็นต้องปรับตัวให้เข้ากับการดำเนินการใด ๆ ที่อาจเกิดขึ้นโดย API ชั้นบน แต่เมื่อเทียบกับน้ำมันดิบประสิทธิภาพการทำงานของ DOM ของ DOM นั้นดีกว่ามากดังนั้น DOM เสมือนจริงของเฟรมเวิร์กสามารถรับประกันได้อย่างน้อยว่ามันยังสามารถให้ประสิทธิภาพที่ดีโดยไม่ต้องเพิ่มประสิทธิภาพด้วยตนเองซึ่งไม่เพียง แต่รับประกันขีด จำกัด ของประสิทธิภาพที่ต่ำกว่า 2. ไม่จำเป็นต้องใช้งาน DOM ด้วยตนเอง: เราไม่จำเป็นต้องใช้งาน DOM ด้วยตนเองเท่านั้น ในวิธีที่คาดการณ์ได้ซึ่งช่วยปรับปรุงประสิทธิภาพอย่างมาก 3. Cross-Platform: DOM เสมือนเป็นวัตถุ JavaScript เป็นหลักและ DOM มีความสัมพันธ์อย่างมากกับแพลตฟอร์ม ข้อเสีย: 1. ไม่สามารถดำเนินการเพิ่มประสิทธิภาพสูงสุด: แม้ว่าการเพิ่มประสิทธิภาพ DOM + เสมือนจริงก็เพียงพอที่จะตอบสนองความต้องการด้านประสิทธิภาพของแอปพลิเคชันส่วนใหญ่ในบางแอปพลิเคชันที่มีความต้องการประสิทธิภาพสูงมาก 2. เมื่อแสดงผล DOM จำนวนมากเป็นครั้งแรกมันจะช้ากว่าการแทรก innerHTML เนื่องจากการคำนวณชั้นพิเศษของการคำนวณ DOM60. จะแก้ปัญหาการสูญเสียข้อมูลได้อย่างไรเมื่อหน้า Vuex ได้รับการรีเฟรช?
จำเป็นต้องใช้ข้อมูล Vuex ขอแนะนำให้ใช้ปลั๊กอิน Vuex-Persist ซึ่งเป็นปลั๊กอินสำหรับการจัดเก็บถาวร Vuex คุณไม่จำเป็นต้องเข้าถึงที่เก็บข้อมูลด้วยตนเอง แต่บันทึกสถานะโดยตรงไปยังคุกกี้หรือการจัดเก็บข้อมูลในพื้นที่61. ทำไม Vuex จึงจำเป็นต้องแบ่งออกเป็นโมดูลและเพิ่มเนมสเปซ?
โมดูล: เนื่องจากการใช้ต้นไม้สถานะเดียวสถานะทั้งหมดของแอปพลิเคชันจะเข้มข้นเป็นวัตถุที่ค่อนข้างใหญ่ เมื่อแอปพลิเคชันมีความซับซ้อนมากวัตถุที่จัดเก็บอาจกลายเป็นป่อง เพื่อแก้ปัญหาข้างต้น Vuex ช่วยให้เราสามารถแยกร้านค้าออกเป็นโมดูล แต่ละโมดูลมีสถานะของตัวเองการกลายพันธุ์การกระทำ getter และแม้แต่ submodules ซ้อนกัน
เนมสเปซ: โดยค่าเริ่มต้นการกระทำการกลายพันธุ์และ getters ภายในโมดูลจะลงทะเบียนในเนมสเปซทั่วโลก - นี้อนุญาตให้หลายโมดูลตอบสนองต่อการกลายพันธุ์หรือการกระทำเดียวกัน หากคุณต้องการให้โมดูลของคุณมีระดับการห่อหุ้มและการใช้ซ้ำที่สูงขึ้นคุณสามารถทำให้เป็นโมดูลที่มีชื่อได้โดยการเพิ่ม namespaced: จริง เมื่อมีการลงทะเบียนโมดูลการรับการกระทำและการกลายพันธุ์ทั้งหมดจะถูกตั้งชื่อโดยอัตโนมัติตามเส้นทางที่ลงทะเบียนโดยโมดูล
62. รูปแบบการออกแบบใดที่ใช้ใน Vue?
1. โหมดโรงงาน - ส่งผ่านพารามิเตอร์เพื่อสร้างอินสแตนซ์เสมือน DOM และส่งคืน vNode ของแท็กพื้นฐานและส่วนประกอบ vNode ตามพารามิเตอร์ที่แตกต่างกัน 2. โหมด Singleton-โปรแกรมทั้งหมดมีเพียงหนึ่งอินสแตนซ์เดียว 3. รุ่น Publish-Subscribe (กลไกเหตุการณ์ Vue) 4. รูปแบบผู้สังเกตการณ์ (หลักการข้อมูลตอบสนอง) 5. โหมดมัณฑนากร (การใช้งานของ @Decorator) 6. โหมดกลยุทธ์63. คุณได้เพิ่มประสิทธิภาพประสิทธิภาพอะไรบ้างสำหรับ Vue? ที่นี่เราแสดงรายการการเพิ่มประสิทธิภาพประสิทธิภาพสำหรับ Vue เท่านั้น
อย่าทำให้ลำดับชั้นของวัตถุลึกเกินไปมิฉะนั้นประสิทธิภาพจะไม่ดี อย่าใส่ข้อมูลที่ไม่ต้องการการตอบสนองในข้อมูล (คุณสามารถใช้ Object.freeze () เพื่อตรึงข้อมูล) คีย์เมื่อข้ามและคีย์คือค่า ID ที่ดีที่สุดและหลีกเลี่ยงการใช้ V -IF ในเวลาเดียวกันรายการข้อมูลขนาดใหญ่และการเพิ่มประสิทธิภาพประสิทธิภาพของตาราง - รายการเสมือนจริง/ตารางเสมือนจริงเพื่อป้องกันการรั่วไหลภายในทำลายตัวแปรทั่วโลกและเวลาหลังจากการทำลายส่วนประกอบ การกำหนดเส้นทางการโหลดแบบขี้เกียจการโหลดแบบอะซิงโครนัสขี้เกียจการจัดเรียงปลั๊กอินของบุคคลที่สามตามความต้องการการใช้งานส่วนประกอบแคชแบบค้ำจุนที่เหมาะสมสำหรับการโหลดการต่อต้านการสั่นสะเทือน64. หลักการของวิธี Vue.Set: การแก้ไข VUE จะไม่ทริกเกอร์มุมมองการอัปเดตในสองกรณี
1. เพิ่มแอตทริบิวต์ใหม่ลงในอินสแตนซ์หลังจากสร้างอินสแตนซ์ (เพิ่มแอตทริบิวต์ลงในวัตถุที่ตอบกลับ) 2. เปลี่ยนตัวห้อยอาร์เรย์โดยตรงเพื่อแก้ไขค่าอาร์เรย์ หลักการของ Vue.set หรือ $ set มีดังนี้ เมื่อเพิ่มแอตทริบิวต์ที่ไม่มีอยู่ในวัตถุแอตทริบิวต์ใหม่จะได้รับการติดตามอย่างต่อเนื่องและจากนั้นผู้เฝ้าดูที่รวบรวมโดย DEP ของวัตถุ OB จะถูกกระตุ้นให้อัปเดต อาร์เรย์จะอัปเดตอาร์เรย์65. สถานการณ์การใช้งานและหลักการของส่วนประกอบการทำงาน
1. ส่วนประกอบที่ใช้งานได้จำเป็นต้องระบุการทำงาน: จริงเมื่อประกาศส่วนประกอบ ฟังก์ชั่นและคุณสมบัติที่คำนวณได้ไม่สามารถใช้งานได้ อ้างอิงจากภายนอกผ่านการอ้างอิงการอ้างอิงจริงคือ htmlelement6 $ attrs และติดตั้งโดยอัตโนมัติข้อดี: 1. เนื่องจากส่วนประกอบของฟังก์ชั่นไม่จำเป็นต้องมีการสร้างอินสแตนซ์เป็นสัญลักษณ์และไม่มีวัฏจักรชีวิตประสิทธิภาพการแสดงผลจึงดีกว่าส่วนประกอบทั่วไป
สถานการณ์การใช้งาน:
ส่วนประกอบการแสดงผลง่าย ๆ ที่ใช้เป็นส่วนประกอบคอนเทนเนอร์เช่นมุมมองเราเตอร์เป็นองค์ประกอบที่ใช้งานได้ "ส่วนประกอบลำดับสูงกว่า" - ใช้เพื่อยอมรับส่วนประกอบเป็นพารามิเตอร์และส่งคืนส่วนประกอบที่ห่อหุ้ม รหัสที่เกี่ยวข้องมีดังนี้:
if (istrue (ctor.options.functional)) {// ผู้ที่มีแอตทริบิวต์การทำงานเป็นส่วนประกอบที่ใช้งานได้ส่งคืน createfunctionalcomponent (ctor, propsdata, ข้อมูล, บริบท, เด็ก); ;66. ทำไมส่วนประกอบของเด็กไม่สามารถแก้ไขเสาที่ผ่านโดยองค์ประกอบหลักได้? อุปกรณ์ประกอบฉากทั้งหมดก่อให้เกิดการเชื่อมโยงลงทางเดียวระหว่างผู้ปกครองและอุปกรณ์ประกอบฉากของเด็ก: การอัปเดตจากเสาหลักจะไหลลงสู่องค์ประกอบของเด็ก แต่ไม่ใช่ในทางกลับกัน สิ่งนี้จะป้องกันไม่ให้องค์ประกอบของเด็กเปลี่ยนสถานะขององค์ประกอบหลักโดยไม่ตั้งใจทำให้การไหลของข้อมูลของแอปพลิเคชันของคุณยากที่จะเข้าใจ
67. การสร้างโครงการ VUE การกำหนดค่าการกำหนดเส้นทางการกำหนดค่าสภาพแวดล้อมการถ่ายโอนค่าส่วนประกอบ ฯลฯ
CSS, คำถามสัมภาษณ์ HTML
HTML และ HTML5 แตกต่างกันอย่างไร?
มีความแตกต่างหลักสามประการ:
1. ความแตกต่างของการประกาศเอกสาร
HTML: ภาษามาร์กอัปไฮเปอร์เท็กซ์ภาษาประเภทข้อความธรรมดา
HTML5.0: เอกสารระบุว่า HTML5 นั้นง่ายต่อการเขียนคล่องตัวและเอื้อต่อการอ่านและการพัฒนาอย่างรวดเร็วโดยโปรแกรมเมอร์
2. ความแตกต่างในความหมายของโครงสร้าง
HTML: แท็กที่ไม่สะท้อนความหมายของโครงสร้างเช่น: <div id = "nav"> </div>
HTML5: เพิ่มแท็กความหมายจำนวนมากเช่น: <Satricine>, <Side>, <Audio>, <BDI> ...
3. ความแตกต่างในการวาดภาพ
HTML: หมายถึงกราฟิกเวกเตอร์ที่ปรับขนาดได้กราฟิกที่ใช้เวกเตอร์ที่ใช้ในการกำหนดเว็บ
HTML5: องค์ประกอบ Canvas ของ HTML5 ใช้สคริปต์ (โดยปกติจะใช้ JavaScript) เพื่อวาดภาพบนหน้าเว็บและสามารถควบคุมพิกเซลทุกพิกเซลของผืนผ้าใบ
โมเดลกล่องคืออะไร?
เราจะแบ่งกล่องออกเป็นหลายส่วน: เนื้อหา, ช่องว่าง, ชายแดนและระยะขอบจะเข้าใจความหมาย HTML5 ได้อย่างไร?
HTML Semantic Tag Header - ชื่อ NAV - บทความนำทาง - ส่วนบทความ - ส่วนหรือย่อหน้า - ด้านข้าง - ส่วนท้ายของแถบด้านข้าง - ส่วนท้ายความหมายของความหมายคืออะไร?
ในกรณีที่ไม่มีรหัส CSS โครงสร้างเนื้อหาและโครงสร้างรหัสสามารถนำเสนอได้ดี (เพื่อให้ผู้ที่ไม่ใช้เทคโนโลยีสามารถเข้าใจรหัส) เพื่อปรับปรุงประสบการณ์ผู้ใช้ เป็นประโยชน์ต่อ SEO Semanticization สามารถสร้างการเชื่อมต่อที่ดีขึ้นกับเครื่องมือค้นหา (เบราว์เซอร์) 1. คุกกี้ (1) ใช้สำหรับการสื่อสารระหว่างไคลเอนต์และเซิร์ฟเวอร์ (2) แต่มันมีฟังก์ชั่นของที่เก็บข้อมูลในเครื่องดังนั้นจึงเป็น "ยืม" (3) document.cookie = ... และแก้ไข (4) ข้อเสียของคุกกี้สำหรับการจัดเก็บ①ความจุในการจัดเก็บมีขนาดเล็กเกินไปมีเพียง 4kb ②คำขอ HTTP ทั้งหมดที่ดำเนินการซึ่งจะส่งผลกระทบต่อประสิทธิภาพของการได้มาซึ่งทรัพยากร③ API นั้นง่ายและจำเป็นต้องถูกห่อหุ้มเพื่อใช้เอกสาร คุกกี้ 2. LocalStorage, SessionStorage (1) ความเชี่ยวชาญ HTML5 ที่ออกแบบมาสำหรับการจัดเก็บความจุสูงสุดคือ 5m (2) API นั้นใช้งานง่ายและใช้งานง่าย (3) lcoalstorage.setItem (คีย์, ค่า); localstorage.getItem (คีย์); (4) ในโหมดที่ซ่อนอยู่ของ iOS Safari: localstorage.getItem จะรายงานข้อผิดพลาดคำแนะนำการใช้การห่อหุ้มด้วยการจับคู่แบบรวม 3. เซสชันสเตชั่นใช้เพื่อจัดเก็บข้อมูลในพื้นที่ในเซสชัน และข้อมูลจะถูกทำลายเมื่อเซสชันสิ้นสุดลง ดังนั้น sessionStorage จึงไม่ใช่ที่เก็บข้อมูลในเครื่องถาวร แต่เป็นเพียงที่เก็บข้อมูลระดับเซสชันเท่านั้น LocalStorage ใช้สำหรับที่เก็บข้อมูลในท้องถิ่นอย่างต่อเนื่อง เมล็ดเบราว์เซอร์ทั่วไปคืออะไร? ** เคอร์เนลตรีศูล: ** หมายความว่าเบราว์เซอร์คือเบราว์เซอร์ดังนั้นเคอร์เนลตรีศูลก็เรียกว่าเคอร์เนล E** Gecko Core: ** หมายถึงเบราว์เซอร์คือเบราว์เซอร์ Firefox เคอร์เนลตุ๊กแกเป็นโอเพ่นซอร์สและข้อได้เปรียบที่ใหญ่ที่สุดคือมันสามารถข้ามแพลตฟอร์มได้
WebKit: WebKit Kernel: เบราว์เซอร์ตัวแทนคือ Safari (เบราว์เซอร์ของ Apple) และ Google Chrome รุ่นที่ต่ำกว่าซึ่งเป็นโครงการโอเพ่นซอร์ส
** Presto Core: ** หมายถึงเบราว์เซอร์ของเบราว์เซอร์ (ภาษาจีนแปลว่า "เบราว์เซอร์เปิด") . เคอร์เนลเลิกใช้แล้ว
** Blink Core: ** พัฒนาโดย Google และ Opera ซึ่งเปิดตัวในเดือนเมษายน 2013 Core Core ปัจจุบันคือกะพริบ
พูดคุยเกี่ยวกับความเข้าใจของคุณเกี่ยวกับมาตรฐานเว็บและ W3C?
มาตรฐานเว็บ:
มาตรฐานเว็บส่วนใหญ่แบ่งออกเป็นสามส่วน: โครงสร้างประสิทธิภาพและพฤติกรรม
โครงสร้าง: หมายถึงแท็กที่เรามักจะเขียนในร่างกายซึ่งส่วนใหญ่ประกอบด้วยแท็ก HTML
ประสิทธิภาพ: หมายถึงสไตล์แท็ก HTML ที่สมบูรณ์ยิ่งขึ้นส่วนใหญ่ประกอบด้วยสไตล์ CSS
พฤติกรรม: หมายถึงการโต้ตอบระหว่างหน้าและผู้ใช้ส่วนใหญ่ประกอบด้วยส่วน JS
W3C:
W3C ได้นำเสนอข้อกำหนดที่เป็นมาตรฐานสำหรับมาตรฐานเว็บคือข้อกำหนดรหัส
ข้อกำหนดด้านโครงสร้าง
1. ตัวอักษรฉลากควรเป็นตัวพิมพ์เล็ก
2. ควรปิดฉลาก
3. แท็กไม่ได้รับอนุญาตให้ซ้อนกันโดยพลการ
ข้อกำหนดด้านประสิทธิภาพและพฤติกรรม
1. ขอแนะนำให้ใช้สคริปต์ลิงค์ภายนอกและสคริปต์ JS เพื่อให้เกิดการแยกโครงสร้างและประสิทธิภาพโครงสร้างและพฤติกรรมซึ่งสามารถปรับปรุงประสิทธิภาพการเรนเดอร์ของหน้าและแสดงเนื้อหาเว็บได้เร็วขึ้น
วิธีการใช้เค้าโครงตอบสนองของเบราว์เซอร์?
ใช้การสืบค้นสื่อ (@media) ใช้เลย์เอาต์แบบยืดหยุ่นใช้หน่วยเปอร์เซ็นต์ใช้หน่วย REM และใช้หน่วย VH และ HWทำความเข้าใจกับตัวเลือกและลำดับความสำคัญของ CSS หรือไม่?
ตัวเลือก CSS ที่ใช้กันทั่วไป
ตัวเลือก ID, ตัวเลือกคลาส, ตัวเลือกแท็ก, ตัวเลือกแอตทริบิวต์, ตัวเลือกคลาสหลอก, ตัวเลือกลูกหลาน
การแบ่งน้ำหนัก
ในระดับเดียวกัน:
! สำคัญ> สไตล์อินไลน์> ตัวเลือก ID> ตัวเลือกคลาส> (ตัวเลือกแท็ก, ตัวเลือกคลาสหลอก, ตัวเลือกแอตทริบิวต์)
ในระดับต่าง ๆ :
โดยปกติค่าน้ำหนักที่สูงขึ้นจะยิ่งมีลำดับความสำคัญสูงขึ้น แต่ก็ไม่มีการแบ่งค่าน้ำหนักที่เฉพาะเจาะจงดังนั้นในการพัฒนาในปัจจุบันส่วนใหญ่จะยิ่งลึกลงไปเท่าไหร่ลำดับความสำคัญก็จะยิ่งสูงขึ้นเท่านั้น
พูดคุยเกี่ยวกับความเข้าใจของคุณเกี่ยวกับ reflow และการวาดใหม่?
Reflow คืออะไร?
Reflow เกิดขึ้นเมื่อความกว้างความสูงเค้าโครงแสดงหรือซ่อนองค์ประกอบหรือโครงสร้างข้อความภายในการเปลี่ยนแปลงองค์ประกอบทำให้หน้าต้องสร้างใหม่ทาสีใหม่คืออะไร?
การวาดใหม่เกิดขึ้นเมื่อความกว้างความสูงเค้าโครงแสดงหรือซ่อนองค์ประกอบของตัวเองไม่เปลี่ยนแปลง แต่เฉพาะรูปแบบลักษณะขององค์ประกอบที่เปลี่ยนไป
เมื่อไหร่จะเกิดการรีดกลับ? เมื่อองค์ประกอบ DOM ที่มองเห็นได้ถูกเพิ่มหรือลบตำแหน่งขององค์ประกอบจะเปลี่ยนขนาดขององค์ประกอบจะเปลี่ยนเนื้อหาการเปลี่ยนแปลงเนื้อหาและเมื่อหน้าจะแสดงผลครั้งแรก
การทาสีใหม่จะเกิดขึ้นเมื่อใด
แสดงรายการสไตล์ CSS ที่เกี่ยวข้อง: สีพื้นหลังขนาดพื้นหลังทัศนวิสัย
ความแตกต่างระหว่างความทึบ: 0, การมองเห็น: ซ่อนและแสดง: ไม่มี?
opacity = 0 องค์ประกอบถูกซ่อนไว้ แต่เค้าโครงหน้าจะไม่เปลี่ยนแปลง
การมองเห็น = ซ่อนองค์ประกอบจะถูกซ่อนอยู่ แต่เค้าโครงหน้าจะไม่เปลี่ยนแปลง แต่เหตุการณ์ที่ถูกผูกไว้กับองค์ประกอบจะไม่ถูกทริกเกอร์
Display = None ซ่อนองค์ประกอบและเปลี่ยนเค้าโครงหน้า
CSS preprocessor
น้อยลงความแตกต่างระหว่างชื่อเรื่องกับ alt ของ <img> คืออะไร?
โดยปกติแล้วเมาส์จะสไลด์เหนือองค์ประกอบ ALT จะปรากฏขึ้น มันสามารถปรับปรุงการเข้าถึงภาพองค์ประกอบแบบอินไลน์และองค์ประกอบระดับบล็อกคืออะไร? IMG เป็นองค์ประกอบใดบ้าง?
ที่อยู่ - ที่อยู่ blockquote - ศูนย์อ้างอิงบล็อก - บล็อกการจัดตำแหน่งกลาง DIR - รายการไดเรกทอรี DIV - ระดับบล็อกที่ใช้กันทั่วไปรวมถึงฉลากหลักของเค้าโครง CSS DL - รายการคำจำกัดความชุดฟิลด์ - ฟอร์มการควบคุมแบบฟอร์ม - แบบฟอร์มแบบโต้ตอบ H1 - พาดหัว H2 - คำบรรยาย H3 - ระดับ 3 หัวเรื่อง H4 - ระดับ 4 หัวเรื่อง H5 - ระดับ 5 หัวเรื่อง H6 - ระดับ 6 หัวเรื่อง HR - บรรทัดตัวคั่นแนวนอน ISIndex - เมนูพรอมต์อินพุต - รายการเมนู noframes - เฟรมเนื้อหาเสริม (แสดงสิ่งนี้สำหรับเบราว์เซอร์ที่ไม่รองรับเฟรม) บล็อก) บล็อก content noscript - เนื้อหาสคริปต์เสริม (เนื้อหานี้จะปรากฏขึ้นสำหรับเบราว์เซอร์ที่ไม่รองรับสคริปต์) OL - แบบฟอร์มที่สั่งซื้อ p - ย่อหน้า - ตารางข้อความที่จัดรูปแบบ - ตาราง UL - รายการที่ไม่ได้เรียงลำดับ
A - จุดยึด ABBR - ตัวย่อตัวย่อ - ตัวอักษรตัวแรก B - ตัวหนา (ไม่แนะนำ) BDO - BIDI แทนที่ขนาดใหญ่ - ตัวอักษรขนาดใหญ่ BR - LINE BREAK CITE - รหัสอ้างอิง - รหัสคอมพิวเตอร์ (จำเป็นเมื่ออ้างถึงซอร์สโค้ด) DFN - กำหนดฟิลด์ EM - เน้นการตั้งค่าตัวอักษร - การตั้งค่าแบบอักษร (ไม่แนะนำ) I - ITALIC IMG - อินพุตภาพ - อินพุตกล่อง KBD - กำหนดคีย์บอร์ดข้อความคีย์บอร์ด - ฉลากตาราง q - ใบเสนอราคาสั้น s - ขีดเส้นใต้ (ไม่แนะนำ) SAMP - กำหนดรหัสคอมพิวเตอร์ตัวอย่าง - การเลือกรายการ ขนาดเล็ก-ช่วงข้อความตัวอักษรขนาดเล็ก-ที่ใช้กันทั่วไปในคอนเทนเนอร์อินไลน์, การกำหนดบล็อกภายในการนัดหยุดงานข้อความ-ขีดเส้นใต้ที่แข็งแกร่ง-ตัวหนาเน้น-ตัวห้อย SUP-SuperScript Textarea-กล่องอินพุตข้อความหลายบรรทัด TT-Teletype Text U
IMG เป็นองค์ประกอบการเปลี่ยนแบบอินไลน์และมีเอฟเฟกต์เช่นเดียวกับองค์ประกอบบล็อก
ความแตกต่างระหว่างแบบอ่านอย่างเดียวและปิดการใช้งานในรูปแบบ
คะแนนทั่วไป: มันป้องกันไม่ให้ผู้ใช้เปลี่ยนเนื้อหาในแบบฟอร์ม ไม่สามารถแก้ไขได้ กล่องข้อความที่ตั้งค่าเป็นปิดการใช้งานไม่สามารถโฟกัสได้ 3 หากฟิลด์ของแบบฟอร์มถูกปิดใช้งานฟิลด์จะไม่ถูกส่ง (ค่าที่ส่งผ่านในแบบฟอร์ม) และอนุกรม1. ป้อน URL ในเบราว์เซอร์และแสดงบนหน้าเว็บ
ความละเอียดของชื่อโดเมนเริ่มต้นการเชื่อมต่อ TCP สามทางเพื่อสร้างการเชื่อมต่อ TCP ขอทรัพยากรในรหัส HTML
2. ข้อเสียของคุกกี้
มีการ จำกัด จำนวนคุกกี้ที่สร้างขึ้นภายใต้ชื่อโดเมนเฉพาะแต่ละตัว โดยทั่วไปจะไม่เกิน 4095 ไบต์
3. เบราว์เซอร์และเมล็ดหลัก
Google Chrome: WebKit/Blink Safari: WebKit IE: Trident Firefox: Gecko Opera: Presto/Webkit/Blink
4. ความแตกต่างระหว่าง SessionStorage และ LocalStorage
SessionStorage ใช้เพื่อจัดเก็บข้อมูลในเครื่องในเซสชัน localStorage ใช้สำหรับการจัดเก็บในตัวเครื่องแบบถาวร ข้อมูลจะไม่มีวันหมดอายุ เว้นแต่ข้อมูลจะถูกลบออก
5. พูดคุยเกี่ยวกับความเข้าใจของข้อกำหนด BFC
BFC เป็นบริบทการจัดรูปแบบบล็อกนั่นคือบริบทการจัดรูปแบบ ผลของ BFC คือการอนุญาตให้องค์ประกอบภายในและภายนอก BFC โต้ตอบกัน
6. กรุณาตั้งชื่ออย่างน้อยสามวิธีในการลดเวลาโหลดหน้าเว็บ
ลดการร้องขอ HTTP ซ้ำ ๆ ในหน้า
7. วิธีเพิ่มประสิทธิภาพของเว็บไซต์ให้เหมาะสม
สำหรับเนื้อหาลดการร้องขอ HTTP: การรวมไฟล์ CSS Sprites และภาพอินไลน์ ใช้ GZIP สำหรับส่วนประกอบ ที่ด้านล่างของหน้า ภาพยืดใน HTML8. ที่เก็บเบราว์เซอร์?
เมื่อมันเป็นชั่วคราวเราจำเป็นต้องจัดเก็บข้อมูลในหน่วยความจำและที่เก็บข้อมูลถาวรจะใช้ได้เฉพาะในเวลาทำงานเท่านั้น ฯลฯ ใน HTTP ที่ดำเนินการโดยอัตโนมัติขีด จำกัด สูงสุดของขนาดคือ 4K คุณสามารถตั้งค่าเวลาหมดอายุด้วยตัวคุณเอง localstorage / sessionstorage: การปิดการจัดเก็บ / การปิดหน้าต่างระยะยาวและการลบขนาด 4 ~ 5mindexdb แบบกระจายแคช REDIS ฐานข้อมูล9. รับ/โพสต์?
รับ: แคชความยาวคำขอมี จำกัด จะถูกบันทึกไว้ในประวัติศาสตร์ไม่มีผลข้างเคียง (ไม่ได้แก้ไขทรัพยากร), idempotent (จำนวนคำขอไม่มีส่วนเกี่ยวข้องกับทรัพยากร) สถานการณ์โพสต์: ความปลอดภัยข้อมูลขนาดใหญ่ประเภทการเข้ารหัสเพิ่มเติม10. ปัญหาด้านความปลอดภัย?
XSS Attack: ชุดคุกกี้รหัสที่เป็นอันตราย httponly เพื่อหลบหนีเนื้อหาอินพุตและเนื้อหาเอาต์พุตในหน้า CSRF: การปลอมแปลงคำขอข้ามไซต์การป้องกัน: รับไม่ได้แก้ไขข้อมูลและไม่สามารถเข้าถึงได้โดยเว็บไซต์ของบุคคลที่สามตั้งค่าคุกกี้ของผู้ใช้ให้เป็น ผู้อนุญาตให้อนุญาตและไม่สามารถเข้าถึงได้โดยบุคคลที่สามเว็บไซต์ขอคำขอขอการตรวจสอบการเพิ่มประสิทธิภาพการทำงาน
1. การเพิ่มประสิทธิภาพประสิทธิภาพด้านประสิทธิภาพคืออะไร?
การบีบอัดและการรวมทรัพยากรลดการร้องขอ HTTP การโหลดแบบอะซิงโครนัสของรหัสที่ไม่ใช่คอร์ใช้แคชเบราว์เซอร์และการใช้ CDN เพื่อแก้ไข DNS ล่วงหน้า2. การโหลดแบบอะซิงโครนัส?
สคริปต์แบบไดนามิกกำลังโหลด deferasync3. วิธีการโหลดความแตกต่างคืออะไร?
การเลื่อนเวลาจะถูกดำเนินการหลังจาก HTML ถูกแยกวิเคราะห์4. โหลดล่วงหน้า?
ในระหว่างการพัฒนาคุณอาจพบสถานการณ์ดังกล่าว ไม่จำเป็นต้องใช้ทรัพยากรบางอย่างทันที แต่คุณต้องการรับพวกเขาโดยเร็วที่สุด การโหลดล่วงหน้าเป็นจริงการดึงข้อมูลซึ่งบังคับให้เบราว์เซอร์ร้องขอทรัพยากรและไม่บล็อกเหตุการณ์ ONLOAD การโหลดล่วงหน้าสามารถลดเวลาในการโหลดของหน้าจอแรกได้ในระดับหนึ่งเนื่องจากไฟล์สำคัญบางไฟล์ที่ไม่ส่งผลกระทบต่อหน้าจอแรกอาจล่าช้าในการโหลด5. DNS ความละเอียดล่วงหน้า?
ความละเอียด DNS ยังต้องใช้เวลาและ IP ที่สอดคล้องกับชื่อโดเมนสามารถรับได้ล่วงหน้าผ่านการแก้ไขล่วงหน้า <meta http-equiv = 'x-dns-prefetch-control' content = 'on'> <link rel = "dns-prefetch" href = "// yuchengkai.cn"> แท็ก A จะไม่เปิดใช้งานโดยค่าเริ่มต้น โปรโตคอล HTTPS pre-parsed ดังนั้น meta จำเป็นต้องตั้งค่าด้วยตนเอง6. การดำเนินการที่ขี้เกียจ? เทคโนโลยีนี้สามารถใช้สำหรับการเพิ่มประสิทธิภาพหน้าจอแรก การดำเนินการขี้เกียจต้องตื่นขึ้นมาซึ่งโดยทั่วไปสามารถทำได้โดยการโทรหาตัวจับเวลาหรือเหตุการณ์
7、懒加载? 懒加载就是将不关键的资源延后加载。
懒加载的原理就是只加载自定义区域（通常是可视区域，但也可以是即将进入可视区域）内需要加载的东西。对于图片来说，先设置图片标签的src 属性为一张占位图，将真实的图片资源放入一个自定义属性中，当进入自定义区域时，就将自定义属性替换为src 属性，这样图片就会去下载资源，实现了图片懒加载。
懒加载不仅可以用于图片，也可以使用在别的资源上。比如进入可视区域才开始播放视频等等。
react面试题
1、什么时候使用状态管理器?
从项目的整体看目用户的使用方式复杂不同身份的用户有不同的使用方式（比如普通用户和管理员）多个用户之间可以协作与服务器大量交互，或者使用了WebSocketView 要从多个来源获取数据从组件角度看某个组件的状态，需要共享某个状态需要在任何地方都可以拿到一个组件需要改变全局状态一个组件需要改变另一个组件的状态组件有相当大量的，随时间变化的数据state 需要有一个单一可靠数据源所有state 放在顶层组件已经无法满足需求了2、说说React 有什么特点?
它使用**虚拟DOM **而不是真正的DOM。它可以用服务器端渲染。它遵循单向数据流或数据绑定3、列出React 的一些主要优点?
它提高了应用的性能可以方便地在客户端和服务器端使用由于JSX，代码的可读性很好React 很容易与Meteor，Angular 等其他框架集成使用React，编写UI 测试用例变得非常容易4、什么是JSX?
它JSX 是J avaScript XML 的简写。是React 使用的一种文件，它利用JavaScript 的表现力和类似HTML 的模板语法。这使得HTML 文件非常容易理解。此文件能使应用非常可靠，并能够提高其性能例子render() {return(<div><h1> Hello World </h1></div>)}5、说说为什么浏览器无法读取JSX?
浏览器只能处理JavaScript 对象，而不能读取常规JavaScript 对象中的JSX。所以为了使浏览器能够读取JSX，首先，需要用像Babel 这样的JSX 转换器将JSX 文件转换为JavaScript 对象，然后再将其传给浏览器6、你理解“在React 中，一切都是组件”这句话?
组件是React 应用UI 的构建块。这些组件将整个UI 分成小的独立并可重用的部分。每个组件彼此独立，而不会影响UI 的其余部分7、 React 中render()的目的?
每个React 组件强制要求必须有一个render()。它返回一个React 元素，是原生DOM 组件的表示。如果需要渲染多个HTML 元素，则必须将它们组合在一个封闭标记内，例如<form>、<group>、<div> 等。此函数必须保持纯净，即必须每次调用时都返回相同的结果8、什么是Props?
Props 是React 中属性的简写。它们是只读组件，必须保持纯，即不可变。它们总是在整个应用中从父组件传递到子组件。子组件永远不能将prop 送回父组件。这有助于维护单向数据流，通常用于呈现动态生成的数据9、React 中的状态是什么？
状态是React 组件的核心，是数据的来源，必须尽可能简单。基本上状态是确定组件呈现和行为的对象。与Props 不同，它们是可变的，并创建动态和交互式组件。可以通过this.state() 访问它们。10、区分状态和Props?
条件StateProps从父组件中接受初始值YesYes父组件可以改变值NoYes在组件中设置默认值NoYes在组件的内部变化YesNo设置子组件的初始值YesYes在子组件的内部改变NoYes11、如何更新组件的状态?
使用this.setState()更新组件的状态12、React 组件生命周期的阶段是什么?
React 组件的生命周期有三个不同的阶段：初始渲染阶段：这是组件即将开始其生命之旅并进入DOM 的阶段。更新阶段：一旦组件被添加到DOM，它只有在prop 或状态发生变化时才可能更新和重新渲染。这些只发生在这个阶段卸载阶段：这是组件生命周期的最后阶段，组件被销毁并从DOM 中删除13、你对React 的refs 有什么了解?
Refs 是React 中引用的简写。它是一个有助于存储对特定的React 元素或组件的引用的属性，它将由组件渲染配置函数返回。用于对render()返回的特定元素或组件的引用。当需要进行DOM 测量或向组件添加方法时，它们会派上用场列出一些应该使用refs 的情况?需要管理焦点、选择文本或媒体播放时触发式动画与第三方DOM 库集成14、如何模块化React 中的代码?
可以使用export 和import 属性来模块化代码。它们有助于在不同的文件中单独编写组件15、什么是高阶组件HOC?
高阶组件是重用组件逻辑的高级方法，是一种源于React 的组件模式。 HOC 是自定义组件，在它之内包含另一个组件。它们可以接受子组件提供的任何动态，但不会修改或复制其输入组件中的任何行为。你可以认为HOC 是“纯（Pure）”组件16、你能用HOC 做什么?
HOC 可用于许多任务:用代码重用，逻辑和引导抽象渲染劫持状态抽象和控制Props 控制17、 React 中key 的重要性是什么?
key 用于识别唯一的Virtual DOM 元素及其驱动UI 的相应数据。它们通过回收DOM 中当前所有的元素来帮助React 优化渲染。这些key 必须是唯一的数字或字符串，React 只是重新排序元素而不是重新渲染它们。这可以提高应用程序的性能18、MVC 框架的主要问题是什么?
key 用对DOM 操作的代价非常高程序运行缓慢且效率低下内存浪费严重由于循环依赖性，组件模型需要围绕models 和views 进行创建19、请你解释一下Flux? 
20、你对“单一事实来源”有什么理解
Redux 使用“store” 将程序的整个状态存储在同一个地方。因此所有组件的状态都存储在store 中，并且它们从store 本身接收更新。单一状态树可以更容易地跟踪随时间的变化，并调试或检查程序。21、列出Redux 的组件?
Redux 由以下组件组成:Action 这是一个用来描述发生了什么事情的对象Reducer 这是一个确定状态将如何变化的地方Store 整个程序的状态/对象树保存在Store 中View 查只显示Store 提供的数据22、 Store 在Redux 中的意义是什么?
store 是一个JavaScript 对象，它可以保存程序的状态，并提供一些方法来访问状态、调度操作和注册侦听器。应用程序的整个状态/对象树保存在单一存储中。因此，Redux 非常简单且是可预测的。我们可以将中间件传递到store 来处理数据，并记录改变存储状态的各种操作。所有操作都通过Reducer 返回一个新状态23、 Redux 有哪些优点?
结果的可预测性可维护性服务器端渲染易于测试-24、 什么是React 路由?
React 路由是一个构建在React 之上的强大的路由库，它有助于向应用程序添加新的屏幕和流。这使URL 与网页上显示的数据保持同步。它负责维护标准化的结构和行为，并用于开发单页Web 应用。 React 路由有一个简单的API。25、说说你对React 的渲染原理的理解?
单向数据流。React 是一个MVVM 框架，简单来说是在MVC 的模式下在前端部分拆分出数据层和视图层。单向数据流指的是只能由数据层的变化去影响视图层的变化，而不能反过来（除非双向绑定）数据驱动视图。我们无需关注页面的DOM，只需要关注数据即可渲染过程，生命周期……setState()大部分时候是异步执行的，提升性能。26、React 中三种构建组件的方式?
React.createClass()、ES6 class 和无状态函数。เจคิวรี่
说出jQuery中常见的几种函数以及他们的含义是什么? （1）get()取得所有匹配的DOM元素集合； （2）get(index)取得其中一个匹配的元素.index表示取得第几个匹配的元素； （3）append(content)向每个匹配的元素内部追加内容； （4）after(content)在每个匹配的元素之后插入内容； （5）html()/html(var)取得或设置匹配元素的html内容； （6）find(expr)搜索所有与指定表达式匹配的元素； （7）bind(type,[data],fn)为每个匹配元素的特定事件绑定事件处理函数； （8）empty()删除匹配的元素集合中所有的子节点； （9）hover(over,out)一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法； （10）attr(name)取得第一个匹配元素的属性值。
jQuery 能做什么？ Get the elements of the page; modify the appearance of the page; change the large content of the page; respond to the user's page operations; add dynamic effects to the page; get information from the server without refreshing the page; simplify common javascript tasks .
如何将一个HTML元素添加到DOM树中的？ 可以通过appendTo()方法在指定的DOM元素末尾添加一个现存的元素或者一个新的HTML元素。
什么是jQuery? jQuer能做什么？ jQuery是一套JavaScript的库，它简化了使用Javascript进行网页特效开发的一些复杂性，提供了对常见任务的自动化和复杂任务的简化
jQuery的作用快速获取文档元素提供漂亮的页面动态效果创建Ajax无刷新网页提供对JavaScript语言的增强增强的事件处理更改网页内容JQuery可以修改网页中的内容,比如更改网页的文本、插入或转网页图像, jQuery简化了原本使用JavaScript代码需要处理的方式。JQuery 的优点1.利用css的选择器提供高速的元素查找行为。 2.提供了一个抽象层来标准化各种常见的任务，可以解决各种浏览器的兼容问题。 3.将复杂的代码简化，提供连缀编程模式，大大简化了代码的操作。
以上就是分享一些值得收藏的精选Web前端面试题（附答案）的详细内容，更多请关注本站其它相关文章！