Apa sih Stateless Component dan Statefull Component

Bee Wijaya
Aug 31, 2018 · 2 min read

Nah, kali ini saya akan membahas apa sih Stateless Component dan Statefull Component dalam React, Apa bedanya dan kapan sebaiknya digunakan.

Stateless Component

Apa sih Stateless Component ?

Stateless Component / Functional Component sebenarnya hanyalah sebuah Dumb Component yang digunakan hanya untuk mengembalikan sebuah Component tanpa logic apapun dan tentu saja bisa juga jika diberikan logic.

Lalu kenapa menggunakan Stateless Component ini ?

Stateless Component biasanya digunakan pada Component yang benar-benar dumb atau Component tanpa logic, biasanya digunakan karna penulisannya yang rapi karna hanya sebuah function yang me-return Component.
Jadi, kita tidak perlu selalu menggunakan Class untuk membuat Component jika Component itu tidak membutuhkan sebuah logic.

Ini contoh penulisan Stateless Component

https://cdn-images-1.medium.com/max/2000/1*XL5uu7lggaRZdKRpWhU3Gw.png

Terlihat lebih rapi bukan ?

Jika ingin membuat sebuah Component, pikirlah baik-baik apakah Component itu membutuhkan logic atau tidak, jika Component itu membutuhkan logic maka gunakanlah Statefull Component dan Jika tidak gunakanlah Stateless Component.

Statefull Component

Sebelumnya, kita telah membahas Stateless Component yang berarti Component yang tidak membutuhkan logic dan sekarang tentu saja kita akan membahas tentang Statefull Component yang berarti kebalikan dari Stateless Component yaitu Component yang tidak hanya berisi sebuah Component namun juga berisi sekumpulan Logic.

Statefull Component digunakan dalam Component yang membutuhkan logic dan juga didalam Statefull Component ini pasti berisi sebuah state dan ini juga salah satu alasan kenapa Functional Component disebut Stateless Component karna Functional Component tidak memiliki state.

Contoh penulisan Statefull Component

http://p0.qhimg.com/t01a336a01d8a6ea604.png

Nah, bisa dilihat diatas ada sekumpulan logic dan ini adalah Statefull Component yang berupa sebuah Class.

Nah, sekarang teman-teman bisa pikirkan baik-baik ingin menggunakan Component yang mana, jika Component itu tidak membutuhkan logic apapun saya sarankan menggunakan Stateless Component dan jika Component itu membutuhkan logic maka gunakan Statefull Component.


Sekian dari saya, Saya harap teman-teman bisa mengerti dalam artikel saya kali ini.
Namun jika teman-teman tidak mengerti, saya harap teman-teman mencari lagi beberapa artikel dengan judul yang sama dan jangan pernah berhenti belajar dan membaca, Terima kasih atas perhatiannya

Bee Wijaya

Written by

Indonesian Software Engineer

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade