오전
오후
MDN을 봐도 뭐라는지 잘 이해가 안된다
너 map이랑 뭐가 다르니..?
문제:
정수 num과 k가 매개변수로 주어질 때, num을 이루는 숫자 중에 k가 있으면 num의 그 숫자가 있는 자리 수를 return하고 없으면 -1을 return 하도록 solution 함수를 완성해보세요.
입출력 예
num | k | result |
---|---|---|
29183 | 1 | 3 |
232443 | 4 | 4 |
123456 | 7 | -1 |
function solution(num, k) {
var answer = 0;
var numString = num.toString();
//var numString = String(num);
//이것도 OK.
var numArr = Array.from(numString);
for (i = 0; i < numArr.length; i++) {
if (numArr[i] == k) {
answer = i + 1;
break;
}
//아래의 예외처리가 없어서 결과가 이상하게 나왔던듯..
//배열을 다돌았는데도 없으면 return -1을 하라~
//그냥 else문을 쓸게 아니라 이렇게 쓰면 된당.
if(i == numArr.length -1) {
return -1;
}
}
return answer;
}
이 문제를 풀기 위해
숫자 - 문자 변환
String()/변수.toString()
문자열 - 배열 변환 메서드Array.from()
을 검색했다.이렇게 풀면 되겠다! 하고 코드쓰려니까 어렴풋해서.. 바로 쓰지 못하고 구글링하는 수준..ㅜ 따흑..
a. 다른 코드의 인자로 넘겨주는 함수
b. 콜백함수를 넘겨받은 코드는 이 콜백함수를 필요에 따라 적절한 시점에 실행(제어권)
c. 예시
알람을 세팅하고 -> 6시 알람을 듣는다
알아서
정해놓은 시간이 됐을 때 알람이 울리는 결과
를 반환!!제어권: 알람시계
callback = call(부르다) + back(되돌아오다) = 되돌아와서 호출해줘잉
✅ 콜백함수는 다른코드(함수 or 메서드)에게
인자로 넘겨줌
으로써 그 제어권도 함께위임
한 함수. 콜백 함수를 위임받은 코드는자체적으로
내부 로직
에 의해 이 콜백 함수를 적절한 시점에 실행
여기까지.. 이해가 되나? 나는 70프로밖에 안된다. 제어권에서 자꾸 되돌이표가 걸린다.
그런데~ 아래 코드와 테이블을 보자 ⬇
var count = 0;
var cbFunc = function () {
console.log(count);
if (++count > 4) clearInterval(timer);
};
var timer = setInterval(cbFunc, 300);
// 실행 결과
// 0 (0.3sec)
// 1 (0.6sec)
// 2 (0.9sec)
// 3 (1.2sec)
// 4 (1.5sec)
code | 호출 주체 | 제어권 |
---|---|---|
cbFunc(); | 사용자 | 사용자 |
setInterval(cbFunc, 300); | setInterval | setInterval |
✅ map() : 콜백함수 내의 로직을 배열의 첫 번째 요소부터 돌리면서 새로운 객체를 리턴해주는 메서드
//Array.prototype.map(callback[, thisArg])
//-> this 생략하면 전역객체 바인딩
//callback: function(currentValue, index, array)
//map : 배열의 모든 요소를 꺼내어 처음부터 끝까지 콜백함수 반복호출 + 새로운 배열 리턴
var newArr = [10, 20, 30].map(function (currentValue, index) {
console.log(currentValue, index);
return currentValue + 5;
});
console.log(newArr);
//자, 그럼 콜백함수의 인자 2개의 위치가 바뀐다면 어떻게 될까요?
📌 .map(function (currentValue, index)
map함수 내부의 콜백함수 function 인자들의 위치가 중요!
첫 번째 인자 : 지금 현재 value
두 번째 인자 : 인덱스
이름은 중요하지 않아..
✅콜백함수도 함수다. 따라서 this가 전역객체를 참조하고 있다
✅제어권을 넘겨받을 코드에서 콜백함수에 별도로 this가 될 대상을 지정한 경우에는 그 대상을 참조함
a. 콜백 함수로 객체의 메서드(obj.method)를 전달하더라더도, 그 메서드는 메서드가 아닌 함수로 호출!
var obj = {
vals: [1, 2, 3],
logValues: function(v, i) {
console.log(this, v, i);
}
};
//method로써 호출
obj.logValues(1, 2);
//callback => obj를 this로 하는 메서드를 그대로 전달한게 아니에요
//단지, obj.logValues가 가리키는 함수만 전달한거에요(obj 객체와는 연관이 없습니다)
[4, 5, 6].forEach(obj.logValues);
a. 동기 : 현재 실행중인 코드가 끝나야 다음 코드를 실행하는 방식
b. 비동기(async) : 실행 중인 코드의 종료 여부와 무관하게 즉시 다음 코드로 넘어가는 방식
알쏭달쏭
Promise는 현재에는 당장 얻을 수는 없지만 가까운 미래에는 얻을 수 있는 어떤 데이터에 접근하기 위한 방법을 제공합니다. 당장 원하는 데이터를 얻을 수 없다는 것은 데이터를 얻는데까지 지연 시간(delay, latency)이 발생하는 경우를 말합니다
I/O나 Network를 통해서 데이터를 얻는 경우가 대표적
new 연산자로 호출한 Promise의 인자로 넘어가는 콜백은 바로 실행돼요
그 내부의 resolve(또는 reject) 함수를 호출하는 구문이 있을 경우
resolve(또는 reject) 둘 중 하나가 실행되기 전까지는
다음(then), 오류(catch)로 넘어가지 않아요
따라서, 비동기작업이 완료될 때 비로소 resolve, reject 호출하는 방법으로 비동기 -> 동기적 표현이 가능합니다
async/await 키워드를 사용하면 비동기 코드를 마치 동기 코드처럼 보이게 작성할 수 있습니다.
✅ await
는 async
가 붙은 함수 내부에서만 사용가능
비동기 함수가 리턴하는 Promise로 부터 결과값을 추출
결과값을 얻을 때까지 기다림
📌 async
가 붙은 함수를 호출하면 명시적으로 Promise객체를 생성해서 리턴하지 않아도 Promise객체가 리턴됨!
✅ 예외처리 try
/catch
📌복기 [스코프 체인] : 식별자 유효 범위를 안에서 바깥으로 검색해나가는 것
environment record : 변수 (호이스팅) ⬅
여기서 먼저 찾고, 없으면
outer environment reference : 실행 컨텍스트가 호출되는 시점의 그 외부 환경을 저장 ⬅외부에서 찾음
Js엔진은 어디서 호출했는지가 X, 어디에 함수를 정의했는지에 따라 상위스코프를 결정
렉시컬 스코프에선 정의된 곳과 실행된 곳을 분리해서 생각해야 함
const x = 1;
function foo() {
const x = 10;
bar();
};
function bar() {
console.log(x);
};
foo(); // ?
bar(); // ?
function foo() {
const x = 1;
const y = 2;
// 클로저
// 중첩 함수 bar는 외부 함수보다 더 오래 유지되며 상위 스코프의 식별자를 참조한다.
function bar() {
debugger;
console.log(x);
}
return bar;
}
const bar = foo();
bar();
중첩 함수 bar는 외부 함수보다 더 오래 유지되며 상위 스코프의 식별자를 참조한다.
✅상위 스코프의 식별자를 참조
하면서return 되어
외부에서도 호출될 수 있는 조건을 갖춘 함수
// 카운트 상태 변경 함수
const increase = (function () {
// 카운트 상태 변수
let num = 0;
// 클로저
return function () {
return ++num;
}
}());
// 이전 상태값을 유지
console.log(increase()); //1
console.log(increase()); //2
console.log(increase()); //3
즉시 실행 함수의 return 값이 increase에 전달!
전달된 function은 클로저다
상위 스코프의 식별자를 참조하고 있기에
➡ 자신이 정의된 위치에 의해 결정된 상위 스코프인 즉시 실행 함수의 렉시컬 환경을 기억함
클로저
는 상태가 의도치 않게 변경되지 않도록 안전하게은닉
(information hiding) 하고특정 함수에게만
상태 변경을 허용하여 상태를안전하게 변경, 유지
하기 위해 사용됨