[TIL] 20230524 - 변수 선언과 데이터 할당/함수 선언문/함수 표현식

변수영역 - 가변

: 새로운 데이터 주소로 계속 바뀌기 때문에 가변!

 

데이터영역 - 불변

: 데이터는 새로운 데이터를 생성하고 새로운 데이터를 변수에 할당하기 때문에 불변!

 

참조형 데이터 영역 - 가변

: 참조형 데이터 영역또한 데이터의 주소를 가져와 담고 있기 때문에 가변! 

 

 

[문제] 변수의 데이터는 가변이기 때문에 변경이 가능한데, 새로운 변수에 담으면 기존 변수 데이터도 영향을 받게됨

 

var user = {
	name: 'wonjang',
	gender: 'male',
};

// 이름을 변경하는 함수, 'changeName'을 정의
var changeName = function (user, newName) {
	var newUser = user; // * 복사한 후
	newUser.name = newName; // * 속성을 접근해서 변경하는 방법
	return newUser;
};

// 변경한 user정보를 user2 변수에 할당
// 가변이기 때문에 user1도 영향을 받게 됨
var user2 = changeName(user, 'twojang');

// 결국 아래 로직은 skip
if (user !== user2) {
	console.log('유저 정보가 변경되었습니다.');
}

console.log(user.name, user2.name); // twojang twojang
console.log(user === user2); // true

[해결] 새로운 객체로 리턴받아 새로운 주소를 할당해서 불면하게 만듬!

var user = {
	name: 'wonjang',
	gender: 'male',
};

// 이름을 변경하는 함수 정의
var changeName = function (user, newName) {
	return {
		name: newName,
		gender: user.gender,
	}; // * 새로운 객체를 생성해서 리턴! 새로운 주소를 할당하게 되기 때문에 불변 한다 (최선의 방법은 아님) 
};

// 변경한 user정보를 user2 변수에 할당
// 불변이기 때문에 user1은 영향이 없다
var user2 = changeName(user, 'twojang');

// 아래 로직이 수행
if (user !== user2) {
	console.log('유저 정보가 변경되었습니다.');
}

console.log(user.name, user2.name); // wonjang twojang
console.log(user === user2); // false

 

함수 선언문/함수 표현식

function a () { /* ... */ }
a(); // 실행 ok

// 함수 표현식. 정의한 function을 별도 변수에 할당하는 경우
// (1) 익명함수표현식 : 변수명 b가 곧 변수명(일반적 case에요)
var b = function () { /* ... */ }
b(); // 실행 ok

// (2) 기명 함수 표현식 : 변수명은 c, 함수명은 d
// d()는 c() 안에서 재귀적으로 호출될 때만 사용 가능하므로 사용성에 대한 의문
var c = function d () { /* ... */ } 
c(); // 실행 ok
d(); // 에러!

나는 주로 함수를 선언할때 

function a() { ... }  이렇게 선언했는데

let b = function() { .... }  이렇게 선언하는게 여럿이 많은 코드를 작업할때 함수명이 중복이 되더라도 덜 위험할 수 있다는걸 알았다

 

ex) 예를들어

10번째 줄에

fucntion sum (x, y) { return x + y; }

.

.

.

5000번 줄에

function sum (x, y) { return x + ' + ' + y + ' = ' + (x + y); }

이렇게 겹쳐도 각 그 아랫부분에만 적용되기때문에!

 

함수 표현식

 

오늘은 정말 머리가 뽀가지는줄 ^^

이론적으로 이해하려니까 어렵다.

그래도 코드를 하나하나 뜯어보면서 잘 이해하기로