คำนำ
JShint ใช้ในการวิเคราะห์และตรวจสอบว่ารหัส JavaScript เป็นไปตามกฎการเข้ารหัสของคุณ เครื่องมือที่ทรงพลังนี้สามารถช่วยระบุข้อผิดพลาดและปัญหาในรหัสของคุณและมันบังคับให้ทีมของคุณรักษาอนุสัญญาและรูปแบบการเข้ารหัสบางอย่างทำให้รหัสเชื่อถือได้และง่ายต่อการอ่าน
ในบทความนี้ฉันจะแสดงวิธีการติดตั้งกำหนดค่าและใช้ JShint รวมอยู่ด้วยเป็นตัวอย่างที่แสดงรายการบรรณาธิการที่ฉันโปรดปรานที่สามารถใช้ JShint ได้
ติดตั้ง JShint
การติดตั้ง JShint นั้นง่ายมากคุณสามารถใช้ Node Package Manager (NPM) หากคุณยังไม่ได้ติดตั้ง NPM คุณสามารถดาวน์โหลดเวอร์ชันล่าสุดจากเว็บไซต์ NodeJS เพื่อติดตั้ง node.js และ NPM
เมื่อติดตั้ง NPM แล้วคุณสามารถใช้คำสั่งต่อไปนี้เพื่อติดตั้ง JShint:
npm ติดตั้ง jshint -g
พารามิเตอร์ -g บอก npm ว่าเราต้องการติดตั้งทั่วโลกเพื่อให้เราสามารถเรียกคำสั่งนี้ในไดเรกทอรีใด ๆ
ตรวจสอบรหัสผ่านบรรทัดคำสั่ง
ตอนนี้ติดตั้ง JShint แล้วลองใช้ jshint ในบรรทัดคำสั่งเพื่อวิเคราะห์ไฟล์รหัส JavaScript
นี่คือไฟล์ที่มีชื่อไฟล์ demo1.json:
เราใช้คำสั่งต่อไปนี้เพื่อวิเคราะห์รหัส:
JSHINT DEMO1.JS
JShint บอกเราว่ามีข้อผิดพลาดในบรรทัดที่ 8 ของไฟล์ Demo1.js เหตุผล: อัฒภาคหายไป
หากเรากรอกเครื่องหมายอัฒภาคที่หายไปและเรียกใช้คำสั่งนี้อีกครั้งจะไม่มีการส่งออกข้อความแสดงข้อผิดพลาด
กำหนดค่า jshint
JShint มีการกำหนดค่าเริ่มต้นเพื่อวิเคราะห์รหัสของคุณ แต่การตั้งค่าการกำหนดค่าได้รับการออกแบบให้มีความยืดหยุ่นมาก มีสี่วิธีในการจัดเตรียมไฟล์การประมวลผลการกำหนดค่าสำหรับ JShint
วิธีหนึ่งคือการใช้พารามิเตอร์ --config เพื่อระบุไฟล์กำหนดค่า:
JShint demo1.js -config -config.json
อีกวิธีหนึ่งคือใส่การกำหนดค่าลงในไฟล์ที่เรียกว่า .jshintrc เนื่องจาก JShint จะค้นหาไฟล์การกำหนดค่านี้ในไดเรกทอรีระดับเดียวกันสำหรับการวิเคราะห์รหัส หากไม่พบมันจะยังคงค้นหาไดเรกทอรีด้านบนจนกว่าไดเรกทอรีรูทซึ่งช่วยให้เราสามารถตั้งค่าไฟล์การกำหนดค่าที่แตกต่างกันสำหรับโครงการ
วิธีที่สามคือการใส่ข้อมูลการกำหนดค่าภายใต้คุณสมบัติ JShintConfig ของไฟล์ package.json
ในสามวิธีใด ๆ เหล่านี้ข้อมูลการกำหนดค่าคือรูปแบบ JSON เพื่อระบุแต่ละพารามิเตอร์เพื่อบอกตัวเลือก JShint ให้เปิดหรือปิด ตัวอย่างเช่น: "ไม่ได้ใช้" และ "Undef" ในไฟล์การกำหนดค่าต่อไปนี้คือการเปิดใช้งานการเตือนภัยสำหรับตัวแปรที่ไม่ได้ใช้และไม่ได้กำหนด "หยิก" ต้องการให้คุณใส่วงเล็บปีกกาไว้บนลูปและบล็อกเงื่อนไขเสมอ "eqeqeq" หมายความว่า == และ! = ถูกห้าม แต่ควรใช้ === และ! == "Globals" ใช้เพื่อระบุตัวแปรที่อนุญาตของตัวแปรทั่วโลกที่ไม่ได้กำหนดไว้ในรหัส
วิธีที่สี่คือการเขียนข้อมูลการกำหนดค่าลงในไฟล์รหัสในคำอธิบายประกอบ
คุณสามารถดูตัวเลือกการกำหนดค่าที่แตกต่างกันเพื่อควบคุมพฤติกรรมของ JShint
ตัวอย่างเล็ก ๆ
ถัดไปเรามาใช้งานกับตัวเลือกในไฟล์กำหนดค่า config.json ที่กล่าวถึงข้างต้น สมมติว่าเรามีไฟล์ JavaScript ด้านล่างซึ่งเป็นเพียงรหัสชิ้นเล็ก ๆ สำหรับการเรียนรู้เท่านั้น
หากเราดำเนินการคำสั่ง jshint demo2.js --config config.json เราจะได้รับผลลัพธ์ต่อไปนี้:
มีข้อผิดพลาด 4 ข้อในรหัสของเรา ในบรรทัดที่ 9 JShint จะแจ้งให้ทราบว่าควรห่อบล็อกรหัส "ถ้า" ในการจัดฟัน ตัวแปร subscription_id ถูกกำหนด แต่ไม่ได้ใช้ ในบรรทัดที่ 9 และ 11 ไม่ได้กำหนด "ยืนยัน" และ "คอนโซล"
เราสามารถหลีกเลี่ยงข้อผิดพลาดสองข้อแรกที่มีการดัดแปลงเพียงเล็กน้อย:
ตอนนี้เรามาเพิ่มตัวเลือกการพัฒนาในไฟล์ config.json และตั้งค่าเป็นจริงเพื่อให้ JShint สามารถรับรู้ "ยืนยัน" และ "คอนโซล"
ณ จุดนี้ถ้าเราเรียกใช้คำสั่ง JShint อีกครั้งจะไม่มีข้อผิดพลาด
สรุป
JShint เป็นเครื่องมือที่ดีมากในการลดข้อผิดพลาดของรหัส บรรณาธิการหลายคนให้การสนับสนุน JShint เพื่อนที่สนใจสามารถศึกษา JShint ได้ ข้างต้นคือทั้งหมดที่เกี่ยวกับการใช้ JShint เพื่อลดข้อผิดพลาด JavaScript ฉันหวังว่ามันจะเป็นประโยชน์กับทุกคนที่ใช้ JavaScript