Bagaimana untuk menyemak kod javascript

Apabila menulis kod JavaScript, kadangkala kita perlu melakukan pemeriksaan kod untuk memastikan kualiti dan kebolehbacaan kod. Pemeriksaan kod boleh membantu kami menemui beberapa kemungkinan ralat dan penulisan yang tidak teratur, supaya pengesanan awal masalah membolehkan kami menyelesaikan masalah dengan lebih cepat, sekali gus mengurangkan kos pembangunan yang tidak perlu. Dalam artikel ini, saya akan menerangkan cara menggunakan dua alatan berbeza untuk memeriksa kod JavaScript.

1 Gunakan alat Lint

ESLint ialah alat semakan kod yang sangat popular yang boleh menyemak kod JavaScript anda dan membantu anda mencari masalah yang mungkin berlaku. ESLint mempunyai set peraturan yang sangat luas yang boleh membantu anda mencari masalah yang tidak dapat dilakukan oleh penyusun tradisional. Pada masa yang sama, ESLint juga boleh mengembangkan fungsinya dengan menyesuaikan peraturan untuk memenuhi pelbagai keperluan.

1. Pasang ESLint

Sebelum kita mula menggunakan ESLint, kita perlu memasang ESLint secara setempat. Sebelum pemasangan, kita perlu memasang Node.js dan npm. Kedua-dua alat ini mesti dipasang pada komputer anda sebelum anda boleh meneruskan langkah berikut.

Untuk memasang ESLint, jalankan arahan berikut dalam terminal:

npm install eslint --save-dev

Setelah pemasangan selesai, anda boleh menggunakan ESLint untuk memeriksa kod JavaScript anda.

2. Mengkonfigurasi ESLint

Sebelum menggunakan ESLint, kami perlu mengkonfigurasi peraturan untuknya supaya ia boleh menyemak kod kami dengan betul. ESLint boleh memuatkan konfigurasi melalui fail .eslintrc.json.

Kami boleh mencipta fail .eslintrc.json dalam direktori akar projek dan mentakrifkan peraturan yang kami perlukan di dalamnya. Berikut ialah contoh fail konfigurasi ESLint:

{
  "parserOptions": {
    "ecmaVersion": 8,
    "sourceType": "module"
  },
  "extends": ["eslint:recommended"],
  "rules": {
    "no-console": "warn",
    "no-unused-vars": "warn"
  }
}

Dalam konfigurasi sampel ini, kami menyatakan bahawa ESLint menggunakan versi ECMAScript 8 dan menggunakan import modul. Kami juga menetapkan beberapa peraturan, seperti memerlukan amaran tentang pembolehubah yang tidak digunakan dan amaran tentang pernyataan console.log.

3. Jalankan ESLint

Selepas melengkapkan konfigurasi, kami boleh menggunakan arahan berikut untuk menjalankan ESLint:

./node_modules/.bin/eslint your-file.js

Arahan ini akan dijalankan pada kod JavaScript anda Semak, dan keluarkan ralat dan amaran. Anda boleh memaparkan hasil yang berbeza, seperti hanya ralat atau amaran, dengan menjalankan ESLint dengan pilihan baris arahan yang berbeza.

2. Use Prettier

Prettier ialah alat yang memformat kod secara automatik. Ia boleh membantu kami menyatukan gaya dan format kod serta meningkatkan kebolehbacaan dan kebolehselenggaraan kod. Apabila kami menulis kod, Prettier boleh melaraskan lekukan, ruang, koma bertitik dan format lain secara automatik dan memastikan gaya dan spesifikasi kod adalah konsisten.

1. Pasang Prettier

Untuk memasang Prettier, jalankan arahan berikut dalam terminal:

npm install prettier --save-dev

Setelah pemasangan selesai, anda boleh menggunakan Prettier untuk anda Kod telah diformatkan.

2. Mengkonfigurasi Prettier

Serupa dengan ESLint, Prettier juga boleh memuatkan peraturan melalui fail konfigurasi. Prettier boleh menyokong hampir semua editor kod, seperti Visual Studio Code, Atom, dsb.

Dalam Kod Visual Studio, kami boleh menambah konfigurasi berikut dalam tetapan ruang kerja:

{
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[javascript]": {
    "editor.formatOnSave": true
  }
}

Konfigurasi ini akan mendayakan pemalam Prettier dan memformat kod secara automatik apabila menyimpan fail JavaScript.

3. Run Prettier

Selepas melengkapkan konfigurasi, kita boleh menggunakan arahan berikut untuk menjalankan Prettier:

npx prettier your-file.js

Arahan ini akan dijalankan pada kod JavaScript anda Format dan keluarkan kod yang diformat. Anda boleh menggunakan pilihan baris arahan yang berbeza untuk melaraskan tingkah laku pemformatan kod.

Ringkasan

Melalui pengenalan di atas, kami dapati bahawa pemeriksaan dan pemformatan kod JavaScript adalah sangat penting dan boleh membantu kami meningkatkan kualiti kod, kebolehbacaan dan kebolehselenggaraan. ESLint dan Prettier ialah dua alat yang sangat praktikal yang boleh anda pasang dan konfigurasi mengikut langkah di atas untuk meningkatkan kecekapan pengekodan dan kualiti kod anda.

Atas ialah kandungan terperinci Bagaimana untuk menyemak kod javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!