TIL_javascript 22년 11월11일

Suding·2022년 11월 11일

항해99 10기 (TIL, WIL)

목록 보기

5/10

학습 목표

챕터 5-1 학습, 예제 풀기
챕터 4 복습
셀프 평가, 잘한점, 개선할점, 내일 시도할 것 기록하기

회고록

셀프 평가
- 어려운 문제들이 나오니 마치 고딩시절 수학공부할때 느꼈던 답답함이 떠올랐다. 그래도 수학은 계산을 내가 해내야만 했지만 코딩은 컴퓨터가 하니까 조금더 수월하다고 생각하자;; 화이팅!
- 책으로 본 내용이 이해가 안되서 동영상 강의도 다시 돌려보고 다른 유트브 해설도 찾아봤다. 붙잡고 있지말고 해설을 빨리 보자.
- 팀원들의 강점을 파악한거 같다.
  - 수현님은 설명을 잘해주신다, 코딩을 1년간 공부하셨다고.
  - 진솔님은 논리적으로 접근을 잘 하신다 그리고 팀원들이 헷갈리는 내용들을 책어디에 있는지 빨리 잘 캐치하고 알려주신다.
  - 나의 강점은 무엇일까? 협업을 위한 분위기 형성, 아이디어 제공?
잘한 점
- 학습한 내용을 복습하기위해 프로그래머스에서 알고리즘을 풀어보는게 좋을지 팀에게 물어봤고 이야기를 하다 내일 모임시간에 프로그래머스에서 문제를 하나 풀어보기로 했다!
- 오늘 이해하지 못했던 예제 문제를 팀에게 설명 부탁하고 내가 이해한것을 다시 한번 설명하는 방법을 거쳤다.
개선할 점
- 복습하는 시간은 3-9 시간에 넣지 말아야겠다. 진도가 밀린다.
내일 시도해볼 것
- 내가 배운내용을 설명하는 습관을 만들어야겠다
- 복습은 오전에 9-12에 하자!

새로운 개념

챕터5-1 함수

함수의 기본 형태 (익명 vs 선언 함수)

function () {}

익명 함수 (anonymous function)

함수를 출력할 때 이름이 붙지 않는다

const 함수 = function () {
	console.log('함수 내부의 코드입니다...1')
  console.log('함수 내부의 코드입니다...2')
  console.log('함수 내부의 코드입니다...3')
  console.log('')
}

함수()
console.log(함수)
//함수를 출력하면 함수에 이름이 붙지 않는다 
**ƒ (){
    console.log('함수 내부의 코드입니다...1')
    console.log('함수 내부의 코드입니다...2')
    console.log('함수 내부의 코드입니다...3')
    console.log('')
}**

선언적 함수

함수를 출력하면 이름이 붙는다

function 함수 () {
	console.log('함수 내부의 코드입니다...1')
	console.log('함수 내부의 코드입니다...2')
	console.log('함수 내부의 코드입니다...3')
	console.log('')
}
함수()
console.log(함수)
//함수를 출력하면 함수에 '함수'라는 이름이 붙는다 
**ƒ (함수){
    console.log('함수 내부의 코드입니다...1')
    console.log('함수 내부의 코드입니다...2')
    console.log('함수 내부의 코드입니다...3')
    console.log('')
}**

숫자 계산하기

function 함수 (매개변수){
	let output = 초기 값
	코드가 처리 된다
	return output
}

최소 값 구하기 
// 함수 min 으로 선헌하기 매개변수에 배열 넣어 주기 

function min (array){

// 초기 값은 배열의 0번째 인덱스 
	let output = array[0]

// for of 반복문 사용하여 items안에 item(요소)과 output을 하나씩 비교해본다
// item이 output 보다 작으면 output= item (최소값) 으로 선언한다
// 배열에 마지막 요소 까지 비교해서 최종적으로 최소값을 리턴한다 
	for (const item of array) {
		if (output > item) {
		output= item 
		}
	}

//최소값을 리턴한다	
return output
}
const inputArray = [10,3,5,2,1] 
console.log(min(inputArray))
> 1

나머지 매개 변수를 사용한 min() 함수

// min의 매개변수는 53, 40,1,-3,100인데 이걸 매개변수를 하나씩 찍어주기 귀찬다 
// min(...items) 라고하면 매개변수들이 items라는 배열안에 들어간다
function min(...items){
	// 배열의 첫번쩨 인덱스를 최초 값으로 정한다 
	let output = items[0] //53 이 최초값이 된다 
	// output과 배열안에 있는 요소를 비교하기위한 for of 반복문 사용
	for (const item of items){
		// 53과 40 비교했을때 40이 더 작다, 그러니까 40이 outputd이 된다, 마지막 요소까지 비교해서 최소값을 구한다
		if (output > item){
		output = item 
		} 
	}
// -3가 최소값이 된다 
return output
}
console.log(min(53,40,1,-3,100))
> -3

전개 연산자 (spread operator)

전개 연산자를 사용하지 않는 경우 배열이 매개변수로 들어온다

전개 연산자를 사용하는 경우 숫자가 하나하나 전개되어 매개변수로 들어 온다

//매개변수를 모두 출력하는 함수 
function sample(...items){
	console.log(items)
}

const array= [1,2,3,4]

console.log(sample(array)) //전개연산자를 사용 하지 않을 때 [Array(4)] 또는 [[1,2,3,4,]]
console.log(sample(...array)) // 전개연사잔 사용 할때  [1,2,3,4]

오답노트

매개변수의 자료형에 따라 다르게 작동하는 min () 함수 이해하기가 어려웠다.

오늘 팀과 튜터님과 배운 내용을 바탕으로 내가 다시 설명해보겠다
Array.isArray() 는 object type이 배열인지 확인 할때 쓰는 메소드
typeof () 는 object의 자료 형태를 확인할때 쓴다

function min(first...rests){   
 
 //최소값 구하기 for of 반복문을 함수를 사용하기 위해 output과 items 변수 선언해준다 
	let output
	let items

// 매개변수의 자료형에 따라 조건 분기하기 
// 매개변수의 자료형이 배열이면, 0번째 인덱스 값을 아웃풋이라고 한다. output=100
if (Array.isArray(first)){
	output=first[0]
	items= first // items는 배열이 된다 [100,30,1,34] if 조건이 true기 때문에 최소값을 찾는 함수로 넘어간다

} else if (typeof(first) === 'number'){
//first의 자료형이 숫자면, first 매개변수 100을 최초값 output으로 선언한다 
// ...rests는 배열이 되기 때문에 나머지 매개변수가 items에 들어간다 [30,1,34]
// else if 조건에 맞춰 최소값을 처리한다 
	output= first
	items= rests
}
// 최소값 구하는 반복문 사용
for (const item of items){
	if (output > item) {
	output = item 
		}
	} 
//최소값 추출
return output
}

console.log (`배열: ${min([100,30,1,34])}`) // 배열: 1
console.log (`숫자: ${min(100,30,1,34)}`) // 숫자: 1

Suding

웹개발자가 되고 싶은 수딩의 코딩 일지

이전 포스트

TIL_javascript 22년 11월10일

다음 포스트