Reduxтогу негизги эки идеясы

Redux китепканасын үйрөнө баштоодон мурда, анын эки негизги идеясы менен таанышалы. Биринчи идея, ал абалды башкарууга тиешелүү, биз аны Reactтеги кадимки эсептегичтин абалы менен мисалда көрөбүз:

function Counter() {
	// State
	const [count, setCount] = useState(0)

	// Action:
	function clickHandler() {
		setCount(count + 1)
	}

	// View:
	return (
		<div>
			<span>{count}</span>
			<button onClick={clickHandler}>+</button>
		</div>
	)
}

Бул коддо биз count өзгөрмөсү үчүн абалды көрөбүз - бул эсептегич үчүн чындыктын булагы. Андан кийин биз амалды (action) көрөбүз - бул окуя, колдонуучунун чыкылдатуусу менен абалды жаңыртууну чакырат. Жана, акыры, көрүнүш (view), анын жардамы менен биз колдонуучу интерфейсин көрсөтөбүз.

Ошентип схема аябай жөнөкөй: баскыч басылат - count абалы (State) басуу (Action) менен өзгөрөт, демек көрүнүш (View) өзгөрөт - биздин учурда бул экрандагы сан.

Бирок, бир эле абалды колдонууга тийиш көптөгөн компоненттер болсо, баары татаалыраак болот. Албетте, мисалы, абалды жогору көтөрүүгө болот, бирок мындай чечим ар дайым маселени чече албайт. Redux бул учурда бизге колдонмонун бир жерин түзүүнү сунуштайт, ал жер жалпы абалды камтышы керек жана бул абалды жаңыртууда аныкталган жүрүм-турум үлгүлөрү. Туура ушул биринчи негизги идеяда жатат (!).

Экинчи идея иммутабелдүүлүк менен байланыштуу, башкача айтканда маалыматтардын өзгөрбөстүгү менен. Сиз, албетте, JavaScriptтен эсиңизде, массивдерди жана объектилерди өзгөртсө болот. Маалыматтарды түздөн-түз өзгөртүү Reduxто, башка фреймворктор сыяктуу эле, жакшы эмес жүрүм-турум катары эсептелет жана алдын ала болжолдой албаган натыйжаларга алып келиши мүмкүн. Ошондуктан Reduxто биздин баштапкы объектилер жана массивдер өзгөрбөс калууга тийиш, жана өзгөртө алабыз гана алардын көчүрмөлөрүн.

Reduxтун биринчи негизги идеясы эмнени түшүндүрөт, айтып бер.

Reduxтун экинчи негизги идеясы эмнени түшүндүрөт, айтып бер.