본문 바로가기

JavaScript136

Javascript) 변수 유효 범위 (block scope, function scope) 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. 변수 유효 범위 block scope - const, let function scope - var block scope (const, let) 전역 공간에서 선언한 a 상수를 test1() 함수 내에서도 호출 할 수 있고, 함수 내에 선언된 지역변수 b는 해당 함수 내에서만 호출할 수 있습니다. 그렇다면 test1() 함수 내에서 선언된 지역 변수 b를 함수 외부에서 호출한다면, 찾을 수 없는 상수라는 에러가 발생하겠죠. for문 또한 마찬가지 초기변수와 for문 내에서 선언한 상수 k를 for문 밖에서 호출한다면 당연히 에러가 발생합니다. 다른 언어를 배웠다면 당연한 원리임을 알 수 있습.. 2022. 5. 19.
Javascript) string API, Math static 메소드 API, Date 객체 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. string API - string 타입의 값 (객체)은 상속받은 string prototype 객체의 메소드를 사용할 수 있음 HTML 코드 확인 Javascript 코드 toUpperCase() - 대문자 변환 toLowerCase() - 소문자 변환 function test1() { const str = "Apple Samsung PinaApple"; console.log(str.toUpperCase()); console.log(str.toLowerCase()); } indexOf() - 찾는 단어의 인덱스 반환 console.log(str.indexOf('Sam')); console.. 2022. 5. 18.
Javascript) alert, console, confirm, prompt(string template), innerText, innerHTML, outerHTML 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. alert, console HTML 코드 사용자 상호작용 | innerHTML | innerText alert | console Javascript 코드 function test1() { alert("안녕하세요~") // 일반사용자 console.log("Hello"); // 개발용 console.error("오류오류!") // 에러메세지 출력 console.dir(document); // 계층 구조 확인 console.time('abc1234'); // 스탑워치시작 for(let i = 0; i < 1000; i++); console.timeEnd('abc1234'); // 스탑워치끝 }.. 2022. 5. 18.
Javascript) this 용법, .parentElement, .className, .classList 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. this 용법 1) 전역에서 this는 window 객체를 가리킴 this 용법 2) 태그의 inline event 속성 안의 this는 현재 tag 객체를 가리킴 function checkAllOrNone(obj) { console.log(obj); } 윈도우 객체가 아닌 넘겨준 tag (checkbox)의 객체가 전달된 것을 확인할 수 있습니다. 전체 선택/해제 HTML 코드 클래스 제어하기 수강신청 전체선택/해제 국어 영어 수학 사회 과학 CSS 코드 Javascript 코드 function checkAllOrNone(obj) { const subjects = document.quer.. 2022. 5. 18.
Javascript) DOM (getElementById, getElementsByTagName, getElementsByClassName, getElementsByName, querySelector, querySelectorAll) 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. DOM (Document Object Model) - document 객체 하위에 html 문서의 태그가 가진 계층구조 그대로 javascript 객체로 변환 - 각각의 tag는 객체(속성)로써 관리됨 HTML 코드 DOM에 접근하기 Helloworld1 Helloworld2 Helloworld3 Helloworld4 Helloworld5 getElementById Javascript 코드 이렇게 객체를 계층형으로 열람할 수 있으며, children 객체를 타고 가서 확인해보면 현재 작성했던 코드들을 계층형으로 확인할 수 있습니다. getElementById - document 하위에 특정.. 2022. 5. 17.
Javascript) 제어문(if, switch), 반복문(for, for-in, for-of, while, do-while), 난수 생성 / prompt() 안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. 제어문 HTML 코드 제어문 분기문 if switch Javascript 코드 if문 Math.random()함수를 이용하여 1 ~ 10까지의 임의의 숫자를 리턴 받았으며, 실수로 반환되므로 Math.floor로 버림처리 하였습니다. switch문 function test2() { const n = prompt("1 ~ 3 사이의 정수를 입력하세요"); // 반드시 string 반환 switch(n) { case "1": console.log('1을 입력하셨습니다.'); break; case "2": console.log('2을 입력하셨습니다.'); break; case "3": conso.. 2022. 5. 17.