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 бұл жағдайда бізге қолданбада жалпыланған күйді қамтитын бір орын жасауды және бұл күйді жаңарту кезіндегі белгілі бір әрекеттер үлгілерін ұсынады. Дәл осыnda бірінші негізгі идея жатыр (!).

Екінші идея иммутабельность, яғни деректердің өзгермейтіндігімен байланысты. Сіз, әрине, JavaScript-тен есіңізде, массивтер мен объектілерді өзгертуге болады. Деректерді тікелей өзгерту Redux-та, басқа фреймворктердегі сияқты, нашар әдет саналады және болжамсыз салдарларға әкелуі мүмкін. Сондықтан Redux-та біздің бастапқы объектілер мен массивтер иммутабельді болуы керек, ал біз олардың көшірмелерін ғана өзгерте аламыз.

Redux-тың бірінші негізгі идеясы неде екенін түсіндіріңіз.

Redux-тың екінші негізгі идеясы неде екенін түсіндіріңіз.