프로그래머스의 문자열 내 p와 y의 개수를 찾는 문제이다. 프로그래머스는 내용 전체를 가져다 쓰는 것을 힘들게 잡기 때문에 설명으로 대체하겠다. s에 input 데이터로 아래와 같은 값들이 들어오고, 정답으로 true나 false boolean 값을 리턴하는 문제이다. s = "pPoooyY"가 들어왔을 때 소문자 p, y와 대문자 P, Y는 같은 계산 한다. 즉 1번은 pP와 yY 가 2개씩 같으므로 TRUE를 반환하고 PyY는 P와 yY로 1 :2 이기 때문에 FALSE를 반환하다.
로직 생각
1. x의 개수와 y의 개수를 변수에 카운트를 해준다.
2. 문자열 s 를 slice 함수를 이용하여 나누어준다.
3. 반복문을 이용하여 n 즉 각각의 문자를 반복하면서 돌고 p 또는 P일 때 x의 카운트를 하나 올려주고,
4. y 또는 Y 일 때 y의 카운트를 하나 올려준다.
5. 카운트 x와 카운트 y 가 같으면 answer로 true 반환
6. 다르면 false 반환
function solution(s){
let x = 0;
let y = 0;
let n = s.slice();
for(let i = 0; i < n.length; i++)
{
if(n[i] == "p" || n[i] == "P")
{
x++;
}
if(n[i] == "y" || n[i] == "Y")
{
y++;
}
}
console.log(x);
console.log(y);
if(y == x)
{
answer = true;
}
else {
answer = false;
}
return answer;
}
런타임이 2.5ms 가 나왔다. for문과 if 문을 많이 썼기 때문에 함수내엣 동작 시간이 좀 걸린 것으로 예상된다. 여러 내장 함수들을 이용하여 런타임을 줄여 보아야겠다.
쉽게 말해 함수에 인자로 함수로 받거나 함수의 반환형이 함수이다면 고차함수라고 생각할 수 있다.
pleaseCallback안에 console.log를 실행시키기 때문에 인자로 함수를 받았기 때문에 고차함수라고 할 수 있다.
function pleaseCallback(tempLog) {
tempLog("안녕");
}
pleaseCallback(console.log);
또한 콜백함수의 경우에도 pleaseCallback 함수 내에 익명함수를 실행시켰기 때문에 함수를 인자로 사용하여 고차함수라고 말할 수 있다.
pleaseCallback((temp) => {
console.log(temp);
});
이처럼 함수내에 함수 또는 함수를 리턴으로 받는 함수들을 고차함수라고 한다.
sort함수
console.log(
[1, 6, 2, 13123, 3, 1235, 95].sort((a, b) => {
return a - b;
})
);
정렬을 할 때 사용되는 sort 함수 또한 정렬을 하기 위해 뒤에 콜백함수를 호출하므로 고차함수의 예시라고 할 수 있다.
2. 재귀함수
재귀함수
재귀함수는 쉽게 말해 자기 자신을 호출하는 함수이다. 영어에서 흔히 himself, myself, itself 같이 자기 자신을 호출하는 함수이다.
function func2(num) {
console.log(num);
if (!num) return 0;
func2(num - 1);
}
func2(10); 을 실행 시켰을 때 num = 10 이고 콘솔에서 10을 찍은 후 if(! 10) 이 거짓이기 때문에 func2(num-1)을 재귀함수로 함수 내에서 호출한다. 이런 식으로 여러 번 자기 자신을 호출하여 10 ~ 1까지 출력하고 if(! 0) 은 참이기 때문에 마지막으로 0을 리턴하면서 끝내기 때문에 10 ~ 0까지 출력되게 된다.
count id 에 이벤트 리스너로 클릭을 받았을 때 ctrl 키를 클릭하면서 클릭을 하면 참이 되고, +e.target.innerHTML -1;을 하여 숫자가 빼진다 여기서 ` + ` 단항연산자가 없고 e.target.innerHTML을 실행하면 011111로 숫자가 더해지지 않고 문자로 숫자가 더해져서 출력될 것이다. ` + `는 0에 숫자를 연산해 주기 위한 단항연산자로 문자열 타입을 숫자로 변환시킨다. 단항연산자를 사용할 수 없는 문자열이라면 NAN을 출력시킨다.
터치 이벤트는 모바일 환경에서 여러 개의 터치가 들어올 수 있다 때문에 터치 배열로 들어오게 된다. 위 코드는 touchstart로 시작 지점부터 touchend로 끝지점까지 터치된 좌표영역을 나타낸다.
2. 이벤트 핸들러
2 - 1. onclick
document.getElementById("btn").onclick = function (e) {
console.log("click했음");
console.log(e);
};
btn 아이디인 버튼 확인? 을 클릭하게 되면 아래와 같이 click 했음과 PointerEvent 객체가 출력된
2 - 2. onload
window.onload = function () {
console.log("페이지 로딩 완료");
};
window.load()는 자바스크립트에서 페이지가 로드되면 자동으로 실행되는 전역 콜백함수이다.
페이지의 모든 요소들이 로드되어야 출력된다. 즉 전체페이지가 모두 불러와진 후에 동작하는 메서드이다.
2 - 3. onsubmit
onsubmit함수는 제출 이벤트가 발생할 때 동작이 발생한다.
test-form에 데이터를 입력하고 입력 완료를 해도 preventDefault() 함수가 동작하여 a 태그를 눌렀을 때도 href 링크로 이동하지 않게 할 경우와 form 안에 submit 역할을 하는 버튼을 눌렀어도 새로 실행하지 않게 하고 싶을 경우 (submit은 작동됨)이다. preventDefault() 가없다면 0.1초만 form이 전송되어 console.log의 내용들은 찍히지 않을 것이다.