<현록/>

위와 같이 탭을 눌렀을 때 이에 대응되는 콘텐츠 내용이 변화하는 탭 전환 기능을 순수 자바스크립트를 활용해 만들어보고자 한다. [첫번째 시도] coffee sandwitch juice bagel Americano BLT sandwitch black tea cheese bagel let t1 = document.querySelector('#tab1'); let t2 = document.querySelector('#tab2'); let t3 = document.querySelector('#tab3'); let t4 = document.querySelector('#tab4'); let c1 = document.querySelector('#content1'); let c2 = document.querySelec..

(진행배경) 프로그래머스 0단계 '배열의 평균값' 문제를 하다가 `Cannot read properties of null` 에러를 마주했다. 해당 에러는 자바스크립트 코드를 작성할때마다 종종 겪던 문제인데, 이번 기회에 정리해 두고자 한다. - 프로그래머스 문제 링크: https://school.programmers.co.kr/learn/courses/30/lessons/120817 [문제 상황 - TypeError: Cannot read properties of null (reading '...') 에러] (문제상황) function solution(numbers) { var sum = 0; var avrg = 0; for (var i = 0; i < numbers.length; i++) { sum +..

// 스코프 체인: 함수에서 어떤 값에 접근이 가능하고 불가한 지 범위 // 라이브러리나 내장함수는 아래와 같이 생각하면 된다 const console = { log() { // 콘솔에 글자 적는 기능 }, }; const x = 'hello'; function c() { const y = 'y'; console.log('c'); function b() { // 2. 여기 b 선언 실행 부분으로 바로 갈 수 있는 것이 아니다. // (uncaught referenceError: b is not defined 발생) 안 되는 경우는 스코프 분석해야 한다. const z = 'z'; console.log('b'); c(); } } function a() { const x = 'bye'; // 스코프가 다르기..

그동안 어렴풋 하게만 알고 있던 콜스택에 대해 강의를 듣고 정리해보았다. // c함수 선언 function c() { const y = 'y'; console.log('c'); } // a 함수 선언 function a() { console.log('a'); function b() { console.log('b'); c(); // c함수 호출 } b(); // b함수 호출 } a(); // a 함수 호출 /출력: a, b, c c(); // c 함수 호출 /출력: c [배운 것] 1. 자료구조 - 스택: 명함집/저금통 FILO or LIFO (가장 처음에 들어온 것이 가장 마지막에 나감) - 큐: 컨베이어 벨트 FIFO (가장 처음 들어온 것이 가장 먼저 나감) 2. 호출과 선언을 명확하게 구분해서 '호..

[구구단 만들기- 함수활용] function timesTable(n) { for(var i=1; i

가장 안쪽 가로가 가장 높은 실행 우선순위 가지고 있음 [주사위 게임] var dice = math.floor(math.random()*6)+1; math.floor --> 내림 math.random --> 0에서 1사이의 임의의 숫자 출력 [예제] function rand(maxNum) { var dice = Math.floor(Math.random() * maxNum)+1; --> 0이 나올 수도 있기에 1을 더해줌. document.write(dice); } rand(6); [소수 출력하기(1과 자기자신으로만 나눠떨어지는 수)] function isPrime(n) { var divisor =2; 2부터 나누기 시작 while(n > divisor) { n이 나누는 수보다 클 때까지 if (% div..

[for 문] for(초기화한 변수값; 조건; 증감 표시) {수행할 명령} : i값 초기화--> i가 10보다 작다가 거짓일때 까지 증감명령 수행 for (var i =0; i

조건문 주어진 조건에 따라 결과값을 출력하는 구문 조건으로는 비교연산자 또는 논리 연산자 사용 [if 문: if(조건){수행할 명령} ] --> 만약 ab) { console.log("a는 b보다 크다."); }else { console.log("a는 b보다 작거나 같다.")' } [else if문] -->여러개의 조건문의 생성할 때 사용 var a=20; var b=40; var c=60; if(a>b) {console.log("a는 b보다 크다."); --> false로 실행하지 X } else if (b>c) {console.log("b는 c보다 크다."); --> false로 실행하지 X } else if (a true로 실행함 } else if (b true로 나왔으므로 추가 실행x } else..

[산술 연산자] console.log(20+10); console.log(20-10); console.log(20*10); console.log(20/10); console.log(20%10); 1씩 감소 var num=10; console.log(++num) --> 플러스하고 넘 출력: 11 console.log(--num) --> 마이너스하고 넘 출력: 10(11에서 1 빼기) console.log(num++) --> 넘 출력 후 플러스1 (10으로 출력되고 보이지 않는 상태에서 1 플러스된채 11로 존재) console.log(num--) --> 넘 출력후 마이너스1 (11로 출력되고 보이지 않는 상태에서 1 마이너스된채 10로 존재) [비교 연산자] (==와 ===차이 유념하기) console.l..

[문자열의 프로퍼티와 메서드] var str1="hello world"; str1.length;