목록2023/JavaScript (42)
Leeyanggoo

codepen design by David López 자바스크립트 선택자란? 선택자란 웹 페이지의 특정 요소를 선택하고 다양한 작업을 수행하기 위해 사용합니다. 자바스크립트의 선택자는 HTML 요소를 선택하는 데 사용되며, 다양한 선택자를 제공합니다. 선택자를 사용하여 선택된 요소는 일반적으로 변수에 할당되어 나중에 사용됩니다. 선택된 요소를 조작하는 데 사용할 수 있는 다양한 메서드와 속성이 있습니다. 그럼 한번 알아볼까요! 🧐 자바스크립트의 다양한 선택자 선택자 설명 getElementById HTML 문서에서 ID 속성을 사용하여 요소를 선택 getElementsByClassName HTML 문서에서 class 속성을 사용하여 요소를 선택 getElementsByTagName HTML 문서에서 지정..

01. 변수 : 데이터 불러오기 변수 안에 저장된 테이터를 불러오는 방법입니다. let x = 100, y = 200, z = "javascript"; console.log(x, y, z); 변수 선언자 'let'을 이용해 x, y, z에 데이터를 저장한다. console.log(변수명)로 변수를 불러온다. 더보기 100200javascript 02. 상수 : 데이터 불러오기 상수 안에 저장된 데이터를 불러오는 방법입니다. const x = 100, y = 200, z = "javascript"; console.log(x, y, z); 'const'를 이용해 변수 x, y, z에 상수 데이터를 저장한다. 상수는 데이터 변경이 불가능하기 때문에 만약 변경한 경우 'undefined'가 출력된다. 더보기 1..

마무리 문제 2. 2개의 숫자를 입력받아 두 수의 최대공약수를 구하는 함수를 작성하고 테스트해 보세요. 예를 들어 4와 12의 최대공약수는 4가 됩니다. 즉 두 수 모두 나누어떨어지는 수 중에서 가장 큰 값이 최대공약수입니다. 길라잡이 주어진 두 수 중에서 어떤 수가 큰 수인지 확인합니다. 두 수가 모두 나누어떨어져야 하므로 두 수 중에서 큰 수까지 반복하면서 작은 수도 나누어떨어지고, 큰 수도 나누어 떨어지는 숫자를 찾습니다. 찾을 때마다 변수에 할당합니다. 반복이 모두 끝나면 변수에는 가장 마지막에 할당된 약수만 남습니다. function test(n1, n2){ if(n1 > n2){ return {big : n1, small : n2} } else { return {big : n2, small :..

마무리 문제 1. 사용자가 프롬프트 창에 숫자를 입력했을 때 그 숫자를 함수로 넘겨주고, 함수에서는 숫자가 양수인지, 음수인지, 또는 0인지 판단해서 알림 창에 보여주는 프로그램을 작성해 보세요. 길라잡이 숫자를 받아서 양수, 음수, 0을 판단하고 알림 창에 표시하는 함수를 선언합니다. paserInt() 함수를 사용해 프롬프트 창에 입력한 내용을 숫자로 변환합니다.(프롬프트 창에 입력한 내용이 숫자가 아니면 parseInt() 함수는 NaN을 반환합니다) 반환값이 숫자일 경우에만 함수를 실행합니다. //내가 쓴 코드 function judge(n){ if(n !== NaN){ if(n === 0){ alert("0은 좀.."); } else if(n > 0){ alert("양수요"); } else if..

01. if문 조건문은 프로그래밍에서 가장 기본적인 구문 중 하나로, 조건에 따라 다른 코드를 실행할 수 있도록 해줍니다. 자바스크립트에서는 if문, switch문, 삼항 연산자 등을 사용하여 조건문을 구현할 수 있습니다. if(조건식){ document.write("실행되었습니다.(true)"); } else { document.write("실행되었습니다.(false)"); } 결과 확인하기 조건식 = 0, null, undefined, false, " "(빈 문자열) = flase 조건식 = 1, '0', '1', 'ABC', true, [], {} = true 0, null, undefined, false, " "(빈 문자열)의 5가지 경우는 false의 조건이다. 0을 제외한 숫자, 문자열, 배열..

함수function란? 자바스크립트로 작성한 프로그램은 작성한 소스에 따라 많은 명령을 순서대로 하나씩 처리합니다. 이때 프로그래머가 기능별로 다양한 명령을 묶어놓은 것을 '함수'라고 합니다. 즉 자바스크립트에서 함수는 일련의 작업을 수행하거나 값을 계산하는 코드 블록입니다. 함수는 프로그램의 여러 부분에서 재사용 가능한 코드를 작성할 수 있도록 해줍니다. 선언적 함수 선언적 함수의 형식과 호출 함수명(); function 함수명(){ 실행문;//console.log() //document.write } 함수명();//선언적 함수는 함수를 호출할 때 앞 또는 뒤에서 호출 가능합니다. 선언적 함수는 'function'이라는 예약어로 함수명을 명시하고, 함수 내용을 중괄호({ })로 감싸는 방식입니다. 이렇..

01. 변수 : 데이터 저장 변수는 데이터를 저장하는 저장소다. var x = 100; //변수 x에 숫자 100을 저장함 var y = 200; //변수 y에 숫자 200을 저장함 var z = "javascript"; //변수 z에 문자 "javascript"를 저장함 console.log(x);//100 console.log(y);//200 console.log(z);//javascript 변수는 3가지 선언자가 있다. 변수는 var, let, const 3가지의 선언자가 있다. 'var'은 동일한 변수로 재선언도 가능하고, 이미 선언된 변수에 새로운 값을 재할당 할 수 있다. 'let'은 동일한 변수로 재선언은 불가능하지만, 이미 선언된 변수에 새로운 값을 재할당 할 수 있다. 'const'는 동..

이번에 배워본 조건문 if문과 저번에 배웠던 반복문 for문을 이용하면 다음과 같은 예제를 풀 수 있습니다. 마무리 문제 1 주어진 배열에서 10보다 큰 값을 찾아 화면에 표시하시오. See the Pen Javasciprt_if_6 by leeyanggoo (@leeyanggoo) on CodePen. 마무리 문제 2 사용자에게 1보다 큰 수를 입력하게 한 후 입력한 숫자까지 짝수만 더하는 프로그램을 작성해 보세요. let num = parseInt(prompt("1보다 큰 숫자를 입력하세요.")); let sum = 0; for(let i = 1; i 1){ for(let i = 1; i "2"는 true를 반환합니다. 하지만, 이러한 자동 변환은 일관성을 유지하기 어려우므로, 가능한 경우에는 문자열..

자바스크립트의 조건문은 프로그램 실행의 흐름을 제어하고 조절하는 데 사용됩니다. 주로 if, else, switch의 세 가지 조건문을 사용합니다. 알아볼까요! if문과 else문 See the Pen javascript_if_1 by leeyanggoo (@leeyanggoo) on CodePen. if 조건문은 프로그래밍에서 가장 기본적인 구문 중 하나로, 주어진 조건식이 true일 경우에만 코드 블록을 실행합니다. if 뒤의 괄호()에는 조건문이 들어갑니다. 위의 예제는 10보다 1이 더 크기 때문에 조건을 만족한 true이며 이에 따라 "실행되었습니다.(true)"라는 문구가 출력됩니다. else문은 if 문과 함께 사용되며, if 문의 조건식이 false일 때 실행됩니다. 두 번째 if문은 괄호..

반복문은 코드 블록을 반복적으로 실행할 수 있도록 하는 구문입니다. 그중 자바스크립트에서 가장 많이 사용하는 반복문은 for문입니다. 반복문을 사용하는 이유는 불필요한 명령을 늘어놓지 않아도 된다는 점, 그만큼 소스 코드도 깔끔해진다는 점입니다. 오늘은 반복문 중에 for문에 대해 알아보겠습니다! :) for문 for문은 지정된 조건이 'true'인 동안 코드 블록을 반복 실행합니다. 일반적으로 반복 횟수가 명확한 경우에 사용됩니다. for문의 구문은 다음과 같습니다. for(초깃값; 조건식; 증감식){ } 초깃값 : 몇 번 반복할지 지정하기 위해 변수를 선언합니다. 초깃값은 보통 0이나 1부터 시작합니다. 조건식 : 문장을 어떤 조건으로 반복할지 정하는 조건식을 넣습니다. for문은 'true'인 동안..

각각의 프로그램이 수식을 만들어야 할 때 필요한 것을 '연산자'라고 합니다. 자바스크립트는 산술 연산자, 대입 연산자, 비교 연산자, 논리 연산자 등이 있습니다. 차례대로 알아보겠습니다. :) 산술 연산자 산술 연산자 종류 속성 설명 + 더하기 연산을 할 때 사용합니다. 문자와 문자, 문자와 변수 등을 연결할 때 사용합니다. - 빼기 연산을 할 때 사용합니다. * 곱하기 연산을 할 때 사용합니다. / 몫을 구할 때 사용합니다. % 나머지를 구할 때 사용합니다. 증감 연산자 ++ 1씩 증가시킬 때 사용합니다. (+와 +의 사이에 공백이 있으면 안 됩니다.) -- 1씩 감소시킬 때 사용합니다. (-와 -의 사이에 공백이 있으면 안 됩니다.) 더하기(+), 빼기(-), 곱하기(*), 나누기(/)는 일반적인 사..

자료형 프로그래밍 언어에는 내장된 여러 가지 형태의 자료 형태(daya type)가 존재하고 그를 자료형이라고 합니다. 자바스크립트의 자료형은 크게 원시 유형과 객체로 구분할 수 있고, 원시 유형은 다시 6가지로 나눠집니다. 먼저 원시 유형의 숫자형부터 차례대로 알아보겠습니다! :) 원시 유형primitive type 원시 유형(원시 값)은 자바스크립트의 기본 타입을 말하며 변형이 불가능한 즉 '불변성'을 지니고 있는 데이터입니다. 원시 유형은 더 이상 단순화할 수 없기 때문에 원시적(primitive)이라고 부릅니다. let a = 3; console.log(a); // 3 a = 5; console.log(a); // 5 언뜻 3이라는 값이 5로 변형했다고 생각할 수 있지만, 데이터 영역에 새로 값 ..