Small Grey Outline Pointer soyoung-
본문 바로가기
[레츠기릿JS] 끝말잇기 만들기 세 가지의 대화상자 const number = parseInt(prompt('몇 명이 참가하나요?'),10); alert(number); const yesOrNo = confirm('맞나요?'); prompt : 사용자로부터 값을 입력 받는다 alert : 사용자에게 경고 메세지를 표시 confirm : 사용자의 확인을 요구 (확인 / 취소) 선택자 querySelector / querySelectorAll 1번째 참가자 제시어: 입력 선택자 사이에 공백(띄어쓰기)을 주어 구분한다 document.querySelector('선택자 내부선택자 내부선택자...'); document.querySelector('body #target button...'); //body태그 안에 있는 id값이 target인 태그.. 2023. 4. 4.
프로그래머스 Javascript Lv.0 옹알이(1) 머쓱이는 태어난 지 6개월 된 조카를 돌보고 있습니다. 조카는 아직 "aya", "ye", "woo", "ma" 네 가지 발음을 최대 한 번씩 사용해 조합한(이어 붙인) 발음밖에 하지 못합니다. 문자열 배열 babbling이 매개변수로 주어질 때, 머쓱이의 조카가 발음할 수 있는 단어의 개수를 return하도록 solution 함수를 완성해주세요. var babbling = ['aya','yee','u','maa','wyeoo']; babbling.forEach((word)=>{ if(word.includes('aya')){ console.log('yes!!!!'); console.log(word.includes('aya')); } }); //yes!!!! //true var babbling = ['ay.. 2023. 4. 2.
[인간JS되기] this를 분석할 수 없는 케이스 제로초님 강의 보고 정리중 addEventListener의 this는 무엇일까 const obj = { addEventListener : function(eventName, callback){ callback(obj); // this가 window -> 땡 }, }; header.addEventListner('click',function(){ console.log(this); //this가 header }); - 결론 : 위의 코드만 봐서는 this를 알 수 없다! 왜냐? this는 호출할 때 정해지는데, addEventListner 함수호출은 어디서 되는지 알 수 없음. - 공식문서를 보면 일반적으로 addEventListener의 this는 앞에 붙은 객체,태그로 되어있다고 명시되어 있다 따라서, 공.. 2023. 3. 28.
[인간JS되기] 자바스크립트의 this 제로초님 인간JS되기 강의 보고 정리 자바스크립트의 this는 다른 언어에서의 this와 다르다 콘솔 로그로 this를 찍어보면 윈도우가 나온다 자바스크립트에서 this는 기본적으로 window라고 생각하면 된다 js(브라우저) - window(전역객체) node - global(전역객체) 이었는데, 최근에는 둘 다 globalThis라는 것으로 합쳐졌다고 한다 (if문으로 분기처리를 하지 않기 위해 통합 되었다고 함) const obj = { name : 'soyoung', sayName(){ console.log(this.name); } }; obj.sayName(); // soyoung 이 때 this는 window를 가리키는 것이 아니라, obj객체를 가리킨다 하지만 항상 이렇게 적용 되는 것은 .. 2023. 3. 23.
[인간JS되기] 호이스팅 제로초님 강의 듣고 정리 중 [인간 JS 엔진 되기 1-5] 호이스팅이란? 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것 var - 호이스팅 시 변수를 초기화 (undefined) let/ const - 호이스팅 시 변수 초기화X function a(){ console.log('a'); b(); console.log(x); // TDZ const x = 'x2'; } TDZ (Temporal Dead Zone) 스코프의 시작 지점부터 초기화 시작 지점까지의 구간 호이스팅을 염두에 두고 코드 분석해보기 예시 코드 const x = 'x1'; console.log(z); var y = 'here'; const z = () => {}; function c(){ const y = 'y';.. 2023. 3. 13.
[인간JS되기] 스코프 체인 제로초님 강의 보고 정리 중 [인간 JS 엔진 되기 1-4] 스코프 체인 정의: 식별자의 유효 범위 일종의 리스트로서 전역 객체와 중첩된 함수의 스코프의 레퍼런스를 차례로 저장하고, 의미 그대로 각각의 스코프가 어떻게 연결(chain)되고 있는지 보여주는 것 스코프 체인을 간단히 설명하면 '함수에서 어떤 값에 접근이 가능한가 불가능한가' ES2015 기준으로 그 이전까지는 함수가 기준이었지만, 그 후로는 { } 블록이 기준이 되었다 함수가 아닌 블록들 if() {} for() {} while() {} 등등.... 그 외에도 { } 그냥 이렇게만 있는 블록도 있는데 객체가 아니므로 주의! => 이걸 객체로 만들고 싶으면 ({ }) 이렇게 소괄호로 감싸서 사용 //객체를 리턴하는 함수가 아니라, 블럭이다 c.. 2023. 3. 6.
[인간JS되기] 자바스크립트 호출 스택 제로초님 강의 보고 정리한 것 [인간 JS 엔진 되기] const x = 'x'; function c(){ const y = 'y'; console.log('c'); } function a(){ const x = 'x'; console.log('a'); function b(){ const z = 'z'; console.log('b'); c(); } b(); } a(); c(); 함수가 여러개 얽혀있는 코드가 있다 실행을 돌려보지 않아도 결과가 어떻게 나오는지, 어떤 함수에서 어떤 변수에 접근이 가능한지 코드를 보고 미리 예측을 할 수 있어야 한다 결과는 a(); // a, b, c c(); // c 자바스크립트 코드, 프로그래밍 코드들을 볼 때 주의할 점이 있다 일반적으로 코드는 위에서 아래, 왼쪽에서 .. 2023. 3. 3.
[인간JS되기] 함수와 함수의 호출, 고차함수 제로초님 유튜브 보고 공부 함수와 함수의 호출 const add = (a,b) => a+b; //함수의 기본 형태(여기선 화살표함수로 표현) function calculator(func, a, b){ return func(a,b); } 함수 두 개를 만들어 준다 함수 add 함수 calculator const add = (a,b) => a+b; /* //위의 코드는 리턴이 생략되어 있다 풀어 쓰면 아래 코드 const add = (a,b) => { retun a+b; }; */ /* 객체 리턴 할 때 const add = (a,b) => ({a+b}); //이렇게 해야 함 const add = (a,b) => {a+b}; // 소괄호로 감싸주지 않으면 다른 결과가 나옴 */ 이 때 add함수에는 retu.. 2023. 2. 26.
프로그래머스 숫자 비교하기 - js 정수 num1과 num2가 매개변수로 주어집니다. 두 수가 같으면 1 다르면 -1을 retrun하도록 solution 함수를 완성해주세요. 나의 풀이 function solution(num1, num2) { if (num1 == num2){ return 1; } else{ return -1; } } 다른 사람의 풀이 function solution(num1, num2) { return num1 === num2 ? 1 : -1; } 삼항연산자 쓸 생각을 안하고 if문부터 돌렸는데 다른 사람 풀이 보니까 다시 생각이 난다 2023. 2. 20.
프로그래머스 코딩테스트 연습 [세균증식] - js 문제 설명 어떤 세균은 1시간에 두배만큼 증식한다고 합니다. 처음 세균의 마리수 n과 경과한 시간 t가 매개변수로 주어질 때 t시간 후 세균의 수를 return하도록 solution 함수를 완성해주세요. 나의 풀이(오답) function solution(n, t) { var answer=0; return answer=Math.pow(n,(t+1)); } 처음에는 n**t 만 생각하고 제출 했더니 오답 나와서 Math.pow를 써봤다가 결국 다 틀렸다 *입력 된 n값에 t시간 동엔 2배씩 증가 t시간 동안 2배씩 증가한다는 것을 고려 안하고 제곱만 생각해서 계속 오답이 나왔다 => return n*(Math.pow(2,t)); => return n * (2 ** t); 다른사람의 풀이 reduce cons.. 2023. 2. 20.

티스토리툴바