변수(Variable)

변수란 상황에 따라서 변할 수 있는 값을 말한다. 다시말해 어떤 값에 대해서 이름(label)을 붙여준 것이 변수라고 이해하면 더 쉽다.

변수의 선언(declare)

한번 선언한 변수를 다시 선언할 수 없다. myAge라는 값을 다시 선언해주면 에러가 발생한다.

let myAge; // let을 이용해 myAge라는 변수를 선언

변수의 할당(assign)

여기서 =는 프로그래밍에서는 같다(equal)의 의미가 아닌 대입(assign)을 의미한다.

myAge = '20'; //20이란 값을 myAge에 대입해줌, 이제 myAge는 20

let myAge = '20;
  선언    할당   

할당이 없는 변수는 undefined라는 값으로 출력되며 변수의 결과물은 다시 변수로 담을 수 있다. 변수명에는 공백을 금지하고 Camel case의 법칙에 따른다(단어의 첫글자를 대문자로 써줘야함)

//동일한 변수를 이용해 대입가능
let sum = 1;
sum = sum + 2;
sum = sum + 3;
sum = sum + 4;

수학적으로는 말이 안되는 과정이지만 오른쪽의 값을 왼쪽에 할당한다는 의미이므로 프로그래밍 상에서는 가능하다. sum이라는 변수를 할당해 줄 때 let을 한번만 사용한 것을 볼 수 있듯이 한번 선언한 변수는 다시 선언할 수 없다.

변수의 타입

• 숫자(number)
• 문자열(string)
• 불리언(boolean)
• 자료형 (서로 섞인 것(compound))
  • 배열(array) let fruits = ['banana','apple','pineapple']
  • 객체(object) let person = { name: 'Steve',age: 32, isStudent:true};
• undefined

---

조건문(conditional expression)

조건문은 어떠한 조건을 판별하는 기준을 만드는 것으로 조건으로는 반드시 비교연산자(comparison operator)가 필요하고 그 비교의 결과는 늘 boolean이어야 한다.

비교연산자

>    //미만
<    //초과
>=   //이하
<=   //이상
===  //같다
!==  //다르다 

==와 !=는 다른 타입의 변수를 엄밀히 비교하지 못하기 때문에 사용을 지양한다.

'3' == 3  //true (string 3과 number 3을 비교했을 때 true가 return되는 오류가 발생)
'3' === 3 //false 

조건문은 어떻게 쓸까?

조건에는 boolean으로 결과가 나오는 비교구문이 들어가야한다.

if(조건1){
//조건1이 통과할 경우
} else if (조건2) {
//조건1이 통과하지 않고
//조건2가 통과할 경우
} else {
//모든 조건이 통과하지 않는 경우
}

논리 연산자(logical operator)

두가지 조건이 한번에 적용되는 경우는 논리 연산자(logical operator)를 사용한다.

isStudent && isFemale; //and연산자
isStudent || isFemale; //or연산자
!isStudent && isFemale; //not연산자 - truthy,falsy여부를 반전시킨다. 학생이 아니면서 여성일 때 true

✔논리 연산자 not
!false //true
!(3>2) //false
!undefined //true
!'Hello' //false

✔논리 연산자 or
true||true
// true
true||false // true
false || false // false

✔논리 연산자 and
true && true // true
true && false //false
false && false // false

기억해야 할 6가지 falsy 값

if문에서 false로 변환되므로 if구문이 실행되지 않는 경우

• if(false)
• if(null)
• if(undefined)
• if(0)
• if(NaN)
• if('') 빈스트링 즉, 값이 없는 문자열

---

함수(function)

함수는 컴퓨터에게 일을 시키기 위한 지시사항의 묶음으로 입력(input)-함수(function)-출력(return)의 과정으로 이루어진다. 함수 이름과 입력(input)이 반드시 들어가야한다.

함수에서 사용하는 input값을 매개변수(parameter)라고 부른다.

✔ 함수의 선언식
function myFunction(input){
//컴퓨터에게 시킬일
}

✔ 함수의 표현식 //변수를 이용해서 값을 계산하려고 할 때
let myFunction = function(input){
/컴퓨터에게 시킬일
}

let timeToGoHome = function(speed,distance){
let time = distance / speed;
console.log(time); //결과를 출력하는 것 
}

함수의 실행

전달인자(arguments)와 함께 함수에 전달하여 함수를 실행한다.

//전달인자(arguments)로 10,200을 넣어주면?
timeToGoHome(10,200)=20;

함수 바깥으로 결과를 가져오려면 return값이 필요하다. 만약 아무것도 return 하지 않으면 함수 호출의 결과는 undefined로 나오게 된다.

 let timeToGoHome = function (speed, distance) {
let time = distance / speed ;
console.log(time);
}
let myTime = timeTOGoHome(20,100);
console.log(myTime); // undefined

function getAreaOfCircle(radius){
let pi = 3.141592;
let areaOfCircle = pi*radius*radius;
return areaOfCircle;
}

---

배열(array)

배열은 순서가 있는 값으로 순서는 인덱스(index), 값은 요소(element)라고 칭한다. 배열의 인덱스는 0부터 번호를 매기며 인덱스를 통해서 배열의 값에 접근한다.

let myNumber = [23,455,43,2];
myNumber[3]=43; //myNumber라는 배열의 2번째 인덱스를 조회 
myNumber[2]=200; //myNumber라는 배열의 3번째 인덱스 값을 변경

//배열 안에 배열을 넣을 수 있다.
let myNumber = [[23,45],[23,44],[44,24]];
//myNumber의 1번째 인덱스 값 
[23,44]
//myNumber의 1번째 인덱스의 0번째 값
myNumber[1][0]; //23

//배열의 길이를 알아낼 수 있다.
myNumber.**length**;//4

//배열의 제일 끝에 요소를 추가할 수 있다.
myNumber.**push**(96);

//배열의 마지막 요소를 삭제할 수 있다.
myNumber.**pop**(21);

*온점을 이용해서 관련된 명령(method)를 실행할 수 있다. 명령을 실행할 때는 함수를 실행하 듯 괄호를 열고 닫는 형태로 실행한다.

---

반복문(loop)

같거나 비슷한 코드를 여러번 실행시켜야 할 경우에 사용하는 구문

반복문을 만드는 과정 : 반복하는 내용을 먼저 코드로 작성하고, 조건을 코드로 작성하자.

let sum=1;
sum = sum+2;
sum = sum+3;
sum = sum+4;

• sum과 숫자(n)의 합을 sum에 대입하자. ➡ sum=sum+n;
• 조건: n은 2부터 시작한다 ➡ let n=2;
• n은 4가 될 때까지 반복한다. ➡ n<=4;
• n은 1씩 증가한다. ➡ n=n+1;

for구문

let sum = 1;
for(let n=2; n<=4; n=n+1) //반복할 조건을 `초기화`,`조건식`,`증감문` 순으로 넣어준다. {
sum = sum+n //반복할 내용을 중괄호 block안에 넣어준다. 
 }
console.log(sum);//10

배열의 반복

배열과 반복문을 조합하는 경우가 많다.

let myNum = [23,65,63,12];
for (let i=0; i<myNum.length; i++//증감연산자로 i=i+1과 같다) {
console.log(myNum[i]);
}

//myNum의 모든 요소를 누적해서 더하기 위해서 필요한 조건과 구문
let myNum = [10,20,40,10];
let sum = 0;
for(let n=0, n<myNumber.length, n++){
sum=sum+myNumber[n];
}

---

객체(object)

왜 객체가 필요하지?
여러 개의 변수를 선언해 줄 때, 각각의 변수는 연관성이 없고 변수의 값이 너무 많이 발생하게 되는 불편함이 생겼다.
➡배열을 사용하면 관계성은 생기지만, 각각의 index가 어떤 정보를 갖고 있는지를 알지 못한다.

let whoAmI = { name : 'Steve', age:28, family:[father,mother,sister] }

객체의 값을 사용하는 방법
1. Dot notation
whoAmI.name; //'Steve'

2.Bracket notation
WhoAmI['family']//[father,mother,sister]

➡이 둘의 차이점은 뭐지?
key값이 변하는 값일 때는 braket notation을 써야한다.
WhoAmI[family]; // Error

객체의 값을 활용하는 방법

 //객체에 value를 추가하는 방법
obj.property = value
 
//객체에 value를 삭제하는 방법
 delete obj.property;
  
//객체의 value를 확인하는 방법
key in obj; //true or false

---

문자열 다루기(string)

str[index]

• 문자를 한글자 한글자 접근할 수 있지만 변경은 어려움 (read-only)
• 연산자를 사용가능
• string 타입과 다른 타입 사이에 + 연산자를 사용하면 string 타입으로 변환됨
  '1'+true//'1true'
  '1'+ 5 // '15'

str.length
문자열 전체 길이를 반환

str.indexof(value)

• argument:찾고자 하는 문자열
• return:처음으로 일치하는 index 위치 (찾고자 하는 문자열이 없으면 -1)
  *lastIndexOf();는 문자열 뒤에서부터 찾음
  ***str.includes(value) //true or false

str.split(seperator)

• argument:분리 기준이 될 문자열
• return:분리된 문자열이 포함 된 배열
• csv형식을 처리할 때 유용
  *줄바꿈은 \n

str.substring(start,end)

• argument:시작 index, 끝 index
• return:시작과 끝 index사이의 문자열

str.toLowerCase()/str.toUpperCase()

• argument:없음
• return value: 대, 소문자로 변환된 문자열

배열 다루기(array)

console.table로 배열을 콘솔에서 표로 확인가능하다. 배열을 처리할 때 굉장히 도움이 된다.

arr.indexOf()
배열에서 지정된 요소를 찾을 수있는 첫 번째 인덱스를 반환하고 존재하지 않으면 -1을 반환합니다.

arr.includes
배열이 특정 요소를 포함하고 있는지 판별하고 boolean형태로 반환됩니다.

arr.push()
배열의 제일 끝에 여러 요소를 추가합니다.

arr.pop()
배열의 제일 끝에 여러 요소를 삭제합니다.

arr.shift()
배열의 제일 앞에 여러 요소를 삭제합니다.

arr.unshift()
배열의 제일 앞에 여러 요소를 추가합니다.

배열의 불변성 유지

mutablility: 원본이 변할 수 있습니다. ex)array, object, arr.push()
immutability: 한번 정의 된 원본이 절대 변할 수 없습니다. ex) string, number arr.slice(); 모든 string method ->원본은 절대 변할 수 없기 때문에 새로운 복제품을 만들어 담아줘야한다.

arr.slice(start,end)
*복제품은 어떻게 만들지?
arr.slice()그 자체를 이용 //arr.slice(0)과 같은 의미로 arr의 전체 값을 똑같이 반환하는 것
end의 index는 포함하지 않는다.