[TIL] 자바스크립트를 알고리즘으로 배웠어요

👨‍⚖️자바스크립트 함수에 대해 공부해보자!

함수의 기본 형태

함수 선언, 함수 호출, 매개변수(parameter), 리턴값

익명함수

function () {} : 이름이 붙어있지 않은 함수를 익명함수라고 부른다

 

함수 선언의 장점

1. 반복 작업을 피할 수 있다.
2. 모듈화로 가독성이 높아진다
3. 기능별 수정으로 유지보수가 좋다.

함수로 모듈화를 깔끔하게 해놓은 코드만큼 보기 좋은게 없지 암

선언적 함수

function 함수() { // 함수 선언식
}

let 함수 = function () {}; // 함수 표현식
let 함수 = () => {}; // 화살표 함수

함수 선언식과 표현식의 호이스팅 차이를 꼭 알고 써야함!

 

화살표 함수와 일반함수의 차이점

JavaScript - 화살표 함수와 일반 함수의 차이

JavaScript - 화살표 함수와 일반 함수의 차이 - CODE:H

정말 정말 중요한 내용!!

화살표함수를 대부분 사용해도 문제가 없기는 하지만 어떤 경우에서 문제가 없는지를 잘 알아둬야한다

 

이 세가지에서 차이점이 있으니 꼭 알아두자

1. this

2. 생성자함수

3. arguments

 

매개변수와 리턴값

function 함수(매개변수, 매개변수 ...) {
	문장
	return 리턴값
}

메소드를 사용할 때도 올바른 매개변수와 리턴값을 인지하고 사용하는 것이 중요!

번외 + 최솟값 함수 만들기

function min(array) {
	let output = array[0]
	for(const item of array) {
		if(output > item) {
			output = item
		}
	}
	return output
}

// Array.reduce를 이용한 방식
array.reduce((a, b) => {a < b ? a : b})

//

Math.min(...array);

+…전개연산자는 array의 element들을 하나씩 전개시켜주는 역할

위에서 파라미터을 제대로 알아야 하는 것처럼 Math.min은 파라미터를 array로 받지 않고 받은 element들 중에서 제일 작은 값을 반환함

 

Array의 메소드들은 정말 많이 사용하니 필수로 숙지!!

⇒ sort, filter, map, foreach, reduce 등등…

기본 매개변수

매개변수에 기본값을 지정하는 방법

함수이름(매개변수, 매개변수=기본값, 매개변수=기본값)

함수 호출시에 파라미터를 받지 않으면 기본값으로 설정됨

예시로 메소드 호출할때마다 파라미터 개수를 다르게 사용하는 것.

 

👨‍🚀객체 가지고 놀기

let synun = function () {};
synun.name = "시넌";
synun.getName = function () {
  return this.name;
};
console.log(synun); // [Function: synun] { getName: [Function (anonymous)] }
// console.log(synun()); // 글로벌이 찍힘
console.log(synun.getName()); // synun

분명히 자바스크립트에서는 함수도 객체로 취급하기 때문에 name 추가가 가능할 텐데 왜 안될까 생각해보다가

함수 이름이 찍혀나오는게 뭔가 의심쩍어서 mdn에서 바로 검색해봤다.

 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/name

Function.prototype.name - JavaScript | MDN

 

아니나 다를까 prototype으로 존재하는 속성이었다.

A Function object's read-only name property indicates the function's name as specified when it was created, or it may be either anonymous or '' (an empty string) for functions created anonymously.

게다가 "read-only"라고 친절하게 적혀있다. 그래서 왜 변하지 않았는지 이후에 __proto__로도 변하지 않은 이유를 알게되었다.

 

=> 위의 코드는 프로토타입 키워드와 겹치지않는 nickname으로 변경하면 아주 잘 작동한다.

 

🎇어메이징 자바스크립트🎇

---

📆오늘의 스케쥴

🤼‍♀️오전 언어 스터디 모임

📃✏오후 알고리즘 모의고사

💪🔩운동

📃✏저녁 알고리즘 풀이

자기전 블로깅

 

level3 가장 긴 팰린드롬

GitHub - synuns/algorithm-study: 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다.

 

level3 다단계 칫솔 판매

GitHub - synuns/algorithm-study: 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다.

배운 것

자바스크립트 함수

1. 함수선언문, 함수표현식, 화살표함수의 차이를 잘 알고 사용하기

2. 객체의 prototype도 잘 알아놓고 사용하자

 

알고리즘 풀이 팁

1. index를 찾는 작업이 오래 걸린다면 Object의 key값을 이용해서 찾는 방식으로 풀이를 바꿔보자!

 index를 찾는 작업 자체가 for문을 한번 돌리는 거라 사용하는 순간 시간 복잡도의 지수가 하나 늘어난다.

 

예시는 상단의 다단계 칫솔판매 문제 해설을 참고

 

2. 극단적인 값이나 예외의 케이스를 잘 파악해서 처리해보자!

문제 다 풀어놓고 말짱 도루묵될 수 있음! 테스트 케이스 한두개가 안되는 경우는 거의 이 문제 때문이니 아예 없거나 전부 맞는 극단적인 값을 생각해보자

 

예시는 상단의 가장 긴 팰린드롬 문제 해설을 참고

아무말

오늘은 모의고사를 본 날이다. 문제는 특별하게 어렵지는 않았는데 그렇다고 엄청 쉽지도 않은 문제들이 출제됐다. 처음 시작했더라도 알고리즘 공부 주간이 시작하고서부터 열심히 했다면 풀 수 있는 문제들이다.

 

처음으로 프로그래머스 3레벨 문제를 건드렸다. 막 생각보다 어렵지는 않다.(카카오 문제 제외) 약간 복합 논리적인 문제들이 많고 어려운 알고리즘으로 풀어야만 하는 문제는 많지 않다. 아직 익숙하지 않은 알고리즘을 사용하는 문제를 풀고 싶은데 프로그래머스에서는 마땅치 않는 느낌.. 다시 백준으로 가야하나. 어려운 알고리즘을 이용하는 문제는 백준이 최곤가 싶다.

 

항해 커리큘럼 중에서도 나만의 공부 페이스를 계속 이어나가야만 한다는 생각이 강하게 들었다. 내가 조금 더 안다고 커리큘럼이 쉽다고 시간 낭비할 수는 없으니까. 얼마 안남은 알고리즘 주차도 다음주의 리액트 주특기 주차도 끊임없이 나의 페이스를 이어나가야겠다.