Apa yang harus saya pelajari dulu sebelum javascript?

Saya kira Anda adalah seorang pengembang web. Semoga Anda baik-baik saja dan Anda memiliki pekerjaan yang hebat, bahkan mungkin Anda wiraswasta atau bekerja sebagai pekerja lepas. Masa depan lapangan terlihat bagus, seperti yang saya jelaskan di artikel terakhir saya. Mungkin Anda baru memulai sebagai pengembang web, mungkin Anda sudah bekerja sebagai programmer untuk waktu yang lama. Betapapun nyamannya Anda dengan JavaScript, itu selalu baik untuk mendapatkan penyegaran pada beberapa topik untuk dibaca atau membuatnya di radar di tempat pertama. Berikut adalah 10 hal yang harus Anda pelajari sebelum Anda dapat menyebut diri Anda master dalam JavaScript

1. Aliran Kontrol

Mungkin topik paling mendasar dalam daftar. Salah satu yang paling penting, mungkin yang paling penting. Jika Anda tidak tahu bagaimana melanjutkan dengan kode Anda, Anda akan mengalami kesulitan. Mengetahui seluk beluk aliran kontrol dasar jelas merupakan suatu keharusan

• if else — Jika Anda tidak tahu ini, bagaimana Anda menulis kode sebelumnya?
• switch_ — pada dasarnya if else dengan cara yang lebih fasih, gunakan segera setelah Anda memiliki banyak kasus berbeda
• for_ — Jangan ulangi, ini gunanya loop. Selain normalfor_ -loop `untuk dari` dan for in sangat berguna. Keuntungan besar dari for_ -loops adalah mereka memblokir, jadi Anda dapat menggunakan async await di dalamnya
• Persyaratan lanjutan — Menggunakan operator ternary dan logis dapat membuat hidup Anda jauh lebih mudah, terutama saat Anda mencoba melakukan hal-hal sebaris, artinya Anda tidak ingin menyimpan nilai untuk digunakan nanti. Contoh

// ternaryconsole.log(new Date().getHours() < 12 ? 'Good Morning!' : 'Time for a siesta')
// logical operatorsconst isJsMaster = prompt('Are you a JavaScript master?') === 'true'
console.log(isJsMaster && 'proficient coder')

2. Penanganan kesalahan

Ini memakan waktu cukup lama bagi saya. Tidak masalah jika Anda bekerja di frontend atau backend, tahun pertama atau lebih, Anda mungkin akan default ke

const calcShape = (width, height, depth, color, angle) => {...}const calcShape = ({width, height, depth, color, angle}) => {...}

0 atau mungkin

const calcShape = (width, height, depth, color, angle) => {...}const calcShape = ({width, height, depth, color, angle}) => {...}

1 untuk kesalahan 'penanganan'. Untuk menulis aplikasi yang bagus, Anda pasti harus mengubahnya dan mengganti log malas Anda dengan kesalahan yang ditangani dengan baik. Anda mungkin ingin memeriksa cara membuat konstruktor Kesalahan Anda sendiri dan cara menangkapnya dengan benar, serta menunjukkan kepada pengguna apa masalah sebenarnya

MEMPERBARUI. Lihat artikel tentang cara menangani Kesalahan dengan anggun

3. Model Data

Mirip dengan bergerak melalui aplikasi Anda terus menerus, Anda harus memutuskan di mana mengelompokkan potongan informasi tertentu dan di mana memisahkannya. Ini tidak hanya berlaku untuk membangun model database, tetapi juga parameter fungsi dan objek atau variabel. Contoh

const calcShape = (width, height, depth, color, angle) => {...}const calcShape = ({width, height, depth, color, angle}) => {...}

_

4. Asinkronitas

Ini adalah aspek yang sangat penting dari JavaScript, Entah Anda mengambil data dari backend atau memproses permintaan secara asinkron di backend itu sendiri. Di hampir semua kasus penggunaan, Anda akan menemukan asinkron dan peringatannya. Jika Anda tidak tahu apa itu, Anda mungkin akan mendapatkan kesalahan aneh, yang akan Anda coba perbaiki selama beberapa jam. Jika Anda tahu apa itu, tetapi Anda tidak benar-benar tahu apa yang harus dilakukan, Anda akan berakhir di callback-neraka. Pendekatan yang lebih baik adalah dengan menggunakan promise dan/atau async await di aplikasi Anda

5. Manipulasi DOM

Ini adalah topik yang menarik. Biasanya itu agak ditinggalkan dalam kehidupan sehari-hari sebagai pengembang. Mungkin Anda mempelajari jQuery dan tidak pernah merasa perlu mengambil beberapa keterampilan manipulasi DOM asli, mungkin Anda hanya menggunakan kerangka kerja frontend, di mana manipulasi DOM khusus jarang diperlukan. Namun, menurut saya ini adalah bagian penting untuk memahami JavaScript, setidaknya di frontend. Mengetahui cara kerja DOM dan cara mengakses elemen memberi Anda pemahaman mendalam tentang cara kerja situs web. Selain itu, akan ada titik di mana Anda harus melakukan beberapa manipulasi DOM khusus, bahkan ketika Anda menggunakan kerangka kerja frontend modern, dan Anda pasti tidak ingin menempatkan jQuery di

const calcShape = (width, height, depth, color, angle) => {...}const calcShape = ({width, height, depth, color, angle}) => {...}

3 Anda hanya untuk mengakses elemen

Foto oleh LinkedIn Sales Navigator di Unsplash

6. Node. js / Ekspres

Bahkan sebagai pengembang frontend, Anda harus mengetahui dasar-dasar node.js. js. Idealnya, Anda juga tahu cara menjalankan server ekspres sederhana dan menambahkan beberapa rute atau mengubah yang sudah ada. JavaScript sangat bagus untuk menulis skrip untuk membantu Anda mengotomatiskan banyak tugas. Oleh karena itu, mengetahui cara membaca file, bekerja dengan jalur file, atau buffer memberi Anda perangkat yang bagus untuk membuat apa saja

7. Pendekatan Fungsional

Ada perdebatan abadi tentang fungsional vs. pemrograman berorientasi objek. Anda mungkin dapat mencapai hal yang sama dengan kedua pendekatan tersebut. Dalam JavaScript, bahkan lebih mudah, Anda memiliki kedua pendekatan yang tersedia. Pustaka seperti lodash memberi Anda koleksi alat yang sangat bagus untuk membangun aplikasi dengan pendekatan fungsional. Saat ini, bahkan tidak perlu menggunakan perpustakaan eksternal lagi. Banyak fungsi terpenting telah diimplementasikan dalam spesifikasi JavaScript resmi. Anda pasti harus tahu cara menggunakan

const calcShape = (width, height, depth, color, angle) => {...}const calcShape = ({width, height, depth, color, angle}) => {...}

_4 `reduce`

const calcShape = (width, height, depth, color, angle) => {...}const calcShape = ({width, height, depth, color, angle}) => {...}

5 `forEach` dan `find`

8. Pendekatan Berorientasi Objek

Mirip dengan pendekatan fungsional, Anda juga harus terbiasa dengan JavaScript berorientasi objek, jika ingin menguasainya. Saya mengabaikan bagian itu untuk waktu yang lama dalam karir saya dan hanya menyelesaikannya dengan solusi, tetapi kadang-kadang lebih baik menggunakan objek/kelas dan contoh untuk mengimplementasikan fungsionalitas tertentu. Kelas banyak digunakan dalam React, MobX, atau konstruktor khusus

9. Kerangka Depan

Tiga besar adalah Bereaksi. js, Sudut dan Vue. js. Jika Anda sedang mencari pekerjaan saat ini, Anda hampir selalu memiliki salah satu dari yang terdaftar sebagai prasyarat. Bahkan jika mereka berubah cukup cepat, penting untuk memahami konsep umum dari mereka untuk memahami cara kerja aplikasi. Juga, lebih mudah untuk menulis aplikasi seperti itu. Jika Anda belum memutuskan kereta mana yang ingin Anda naiki, saran saya adalah Bereaksi. js. Saya telah mengerjakannya selama beberapa tahun terakhir dan tidak menyesali keputusan saya

10. Bundling / Transpilasi

Sayangnya, ini adalah bagian besar dari pengembangan web. Di satu sisi saya tidak boleh mengatakan malang, karena sangat bagus bisa menulis kode dengan semua fitur terbaru. Di sisi lain, alasan mengapa saya mengatakan itu adalah karena kami harus selalu ingat bahwa ada browser lama yang mungkin tidak mendukung fitur ini, oleh karena itu kami harus mengubah kode kami menjadi sesuatu yang lain yang dipahami oleh browser lama. Jika Anda bekerja dengan node. js, Anda mungkin akan memiliki lebih sedikit paparan untuk mengubah kode Anda. Standar de-facto untuk transpilasi adalah babel. js, jadi biasakanlah. Adapun untuk menggabungkan kode Anda dan menyatukan semuanya, Anda memiliki beberapa opsi. Webpack adalah pemain dominan untuk waktu yang lama. Beberapa waktu yang lalu, parsel muncul entah dari mana dan sekarang menjadi solusi pilihan saya, karena sangat berkinerja dan mudah dikonfigurasi, meskipun tidak sempurna

BONUS. Ekspresi Reguler

Ini tidak spesifik untuk JavaScript, tetapi sangat membantu dalam banyak kasus penggunaan. Sama membingungkannya juga. Mengenal sintaks Ekspresi Reguler pasti membutuhkan waktu dan mengingat semua opsi yang berbeda tidak mungkin

Memperbarui. Pengujian

Seperti yang ditunjukkan oleh Paul Kamma, pengujian adalah bagian yang sangat penting dari pengembangan perangkat lunak, tidak terkecuali JavaScript. Saat menulis kode, Anda (semoga) mengujinya sebelum Anda mendorong fitur tersebut, meskipun mungkin manual. Pendekatan yang lebih baik adalah menggunakan pengujian otomatis, jenis pengujian yang berbeda adalah pengujian unit, pengujian end-to-end, pengujian beban, pengujian keamanan, atau pengujian frontend (mis. g. apakah komponen terpasang atau tidak). Ada banyak lingkungan pengujian yang berbeda, enzim, melati, moka, chai, dll. Solusi favorit saya saat ini adalah ava. js, jadi periksalah jika Anda tidak bekerja dengan tes otomatis sejauh ini

Semoga Anda sudah mengetahui semua topik yang tercantum di atas. Jika tidak, bekerjalah dan cobalah menjadi master dalam JavaScript. Ini Sangatlah Berarti. Ingatlah bahwa berlatih adalah segalanya dalam hal pengkodean, jadi meskipun Anda tidak terbiasa dengan konsep-konsep ini atau mengetahuinya tetapi Anda tidak benar-benar tahu cara menerapkannya, itu akan datang di masa mendatang.

Apa pendapat Anda tentang daftar itu?

tentang Penulis. Lukas Gisder-Dubé ikut mendirikan dan memimpin startup sebagai CTO selama 1 1/2 tahun, membangun tim teknologi dan arsitektur. Setelah keluar dari startup, dia mengajar coding sebagai Lead Instructor di Ironhack dan sekarang sedang membangun Startup Agency & Consultancy di Berlin. Lihat dube. io untuk mempelajari lebih lanjut

Apa yang harus saya pelajari terlebih dahulu sebelum mempelajari JavaScript?

Haruskah seorang pemula memulai dengan JavaScript?

Haruskah saya belajar C++ sebelum JavaScript?

Haruskah Anda mempelajari HTML sebelum JavaScript?