Linting JavaScript dengan JSHint

Linting dalam pengaturcaraan komputer adalah proses kod analisa statik untuk mencari masalah seperti sintaks yang salah, dan penggunaan kod yang salah. Alat yang digunakan untuk linting dikenali sebagai a serpihan atau linter. Salah satu daripada jambatan yang tersedia untuk JavaScript hari ini adalah JSHint.

JSHint boleh didapati untuk pelbagai platform. Alat web dalam talian yang kebanyakan kita kenal adalah di jshint.com. Terdapat juga alat baris arahan melalui Node.js, a API JavaScript, pelbagai editor teks, dan plugin IDE untuk JSHint. Anda dapat melihat senarai lengkap alat JSHint yang tersedia untuk persekitaran yang berbeza dalam memuat turun dan memasang laman web JSHint.

Menurut laman webnya, dua cara yang paling biasa digunakan alat JSHint ialah alat baris perintah dan juga API. Mari kita lihat bagaimana anda boleh memuat turun menggunakan kedua-duanya, bersama-sama dengan lain-lain linting optiosn alat yang disediakan.

Melalui Alat Talian Perintah

(1) Jika anda tidak mempunyai Node.js dipasang di komputer anda, maka anda perlu pergi ke tapak webnya dan memuat turun dan memasangnya terlebih dahulu. Untuk memeriksa sama ada Node.js telah berjaya dipasang, anda boleh menjalankan arahan npm -version dalam antara muka baris arahan (CLI) dan ia akan menunjukkan kepada anda versi Node.js di komputer anda (atau anda hanya boleh menjalankan arahan npm dan lihat apa yang berlaku).

(2) Untuk memasang alat JSHint, jalankan arahan npm memasang jshint di CLI. Sekiranya anda ingin menyemak jika JSHint telah berjaya dipasang, jalankan arahan tersebut jshint -version untuk melihat versinya. Setelah langkah ini selesai, pemasangan selesai.

(3) Untuk menjalankan alat tersebut, pergi ke direktori di CLI di mana fail JavaScript anda (katakan test.js) adalah dan jalankan arahan jshint test.js. Hasil dari analisis alat pada kode JavaScript Anda akan muncul (seperti ini):

Melalui API JavaScript

(1) Muat turun fail dimampatkan dari pautan GitHub ini, dan unzipnya. Di dalam dist folder yang anda akan dapati jshint Fail JS (perpustakaan API).

(2) Untuk menggunakan API, tambahkan jshint Fail JS ke projek anda dan hubungkannya ke halaman anda. API boleh diakses dalam kod JavaScript menggunakan fungsi / objek yang dipanggil JSHINT. Di bawah adalah kod HTML contoh di mana API JavaScript JSHint digunakan untuk menganalisis kod JavaScript yang terdapat di dalam sumber pelbagai dan memaparkan hasil analisis pada halaman.

(3) Kami lulus sumber array yang mengandungi kod sumber JavaScript untuk dianalisis dan pilihan objek yang mengandungi pilihan linting (kami akan masuk pilihan tidak lama) sebagai parameter kepada JSHINT fungsi. Hasil analisis (objek JSON) diambil dari JSHINTharta fungsi dipanggil data.

(4) JSON.stringify digunakan untuk paparan sahaja di sini, untuk memaparkan hasil yang dipulangkan dari data berfungsi dalam format rentetan pada halaman. The dicantikkan Rentetan JSON kelihatan seperti ini. Bahagian yang diserlahkan ialah kesilapan-kesilapan yang dijumpai oleh JSHint dalam perkataan mudah.

Linting Options

Pilihan linting membolehkan kita mengkonfigurasi proses linting. Kita boleh menentukan jenis kesilapan atau pengurangan yang perlu diisi dan yang tidak. Dalam contoh sebelumnya, dua pilihan linting digunakan iaitu undef dan tidak digunakan.

undef pilihan bendera yang tidak diisytiharkan pembolehubah, dan tidak digunakan akan membenderakan pembolehubah yang diisytiharkan tetapi tidak pernah digunakan. Seperti ini terdapat lebih banyak lagi pilihan yang boleh anda lihat dalam senarai di halaman ini, jika anda ingin mencari pilihan, terdapat bar carian yang disediakan di sudut kanan atas.

Jika anda menggunakan alat CLI melalui Node.js, anda boleh menulis pilihan linting di dalam a package.json fail di bawah harta itu jshintConfig dalam direktori yang sama. Anda juga boleh menambah pilihan sebagai arahan dalam kod JavaScript.

 // - test.js - / * jshint undef: true, unused: true * / foo (); a = 7;

Terdapat lebih banyak cara untuk mengkonfigurasi pilihan linting dalam projek anda berdasarkan alat yang anda gunakan. Semak cara yang berbeza untuk konfigurasi di sini.