성준이의 공부블로그

공부단 3일차-2입니다. 조건이 많을 경우 사용하는 switch()문 var session = prompt("관심 세션 선택\n1-마케팅 2-개발 3-디자인", "1") if(session != null) { switch(session) { case "1": document.write("마케팅") case "2": document.write("개발") case "3": document.write("디자인") } } else { alert("취소") } section의 값을 입력 받고 그 값이 '1'일 경우 '마케팅'을 화면에 출력합니다. 그 값이 '2'일 경우 '개발'을 화면에 출력합니다. 그 값이 '3'일 경우 '디자인'을 화면에 출력합니다. 만약 값이 없다면 취소 알림 창을 띄웁니다.

공부단 3일차-1입니다. if문 사용법 if(조건) { // 조건이 true일 경우 } else { // 조건이 false일 경우 } 3의 배수 구하기 var num = prompt("숫자를 입력하세요") // document.write(typeof(num)) // string if(num != null) { num = parseInt(num) if(num % 3 == 0) document.write("3의 배수") else document.write("3의 배수가 아님") } else { alert("취소") } prompt로 입력받은 것은 string형이기 때문에 parseInt()로 정수형으로 변환해줘야 합니다. 조건연산자 // 조건 ? 조건이 true일 경우 : 조건이 false일 경우 var s..

공부단 2일차-3입니다. 산술연산자와 할당 연산자 연산자이름 기호 설명 더하기 + c = a + b 빼기 - c = a - b 곱하기 * c = a * b 나누기 / c = a / b 나머지 % c = a % b 증가 ++ a++ 감소 -- a-- += y += x -= y -= x *= y *= x /= y /= x %= y %= x currentYear - birthYear + 1 피연산자 : currentYear, birthYear , 1 연산자 : -, + 할인 가격 계산 프로그램 만들기 원래 가격 원 할인율 % 할인 가격 계산하기 function showPrice() { var originPrice = document.querySelector('#oPrice').value // 입력한 값 받아오..

공부단 2일차-2입니다. 자료형의 종류 자료형 설명 기본형 number 숫자 string 문자열. '' 혹은 ""로 묶어 표현 boolean 참과 거짓 두 가지 값만 가짐 undefined 자료형을 지정하지 않았을 떄 유형(값을 정의하지 않은 변수) 복합형 null 유효하지 않은 값 array 배열 object 함수와 속성이 포함된 유형 자료형을 확인하는 연산자 - typeof 연산자 정수형&실수형 정수와 실수 둘다 number로 나옵니다. 즉, 둘 다 숫자형입니다. 문자형 논리형 undefined와 null undefined는 처음부터 변수에 값이 할당되지 않았다 는 의미입니다. undefined자료형이 아닙니다. null은 처음에 할당된 값이 유효하지 않다 라는 의미입니다. 보통 변수를 초기화 할 때..

공부단 2일차-1입니다. 변수란? 변하는 값을 저장할 때 사용합니다. 변수의 예) name, age, student, user, gender, ... 등 상수란? 변수가 변하는 값이면 상수는 변하지 않는 값입니다. 변수를 선언하는 3가지 규칙 변수명은 의미있게 짓는다. 두 개의 단어 이상을 연결할 경우 카멜표기법을 사용한다.(혹은 _를 사용한다) 카멜표기법: userName, currentYear, userAge, ... 등 첫 글자는 반드시 문자, _, $ 기호로 시작해야 한다. 변수에 값이나 식 저장하기 var name = "Jun" var age = 23 var birthYear = 2000 나이 계산 프로그램 만들기 나이 계산하기 (결과 값 표시) function calc() { const cur..

공부단 1일차-4 입니다. prompt() 함수는 사용자에게 어떤 값을 입력받을 때 사용하는 함수입니다. 먼저 콘솔창에서 실행해 보겠습니다. 콘솔창에서 prompt();를 입력하고 Enter키를 누르면 입력받는 창이 뜹니다. 그리고 값을 입력하고 확인을 누르면 이렇게 결과가 출력됩니다. 이것을 vscode에서 해보겠습니다. promptPractice.html 파일을 생성 후 위의 코드를 작성하고 실행하면 이렇게 입력받는 창이 뜹니다. 값을 입력하면 위의 실행결과 화면이 출력됩니다. 여기서 var userName = prompt('당신의 이름은?') 이 prompt() 함수로 값을 입력받고 그 값을 userName이라는 변수에 저장한다는 의미입니다. 그리고 document.write(userName)를 이..

공부단 1일차-3입니다. HTML 문서안에 이런식으로 작성하는 것은 간단한 코드일 경우에는 상관없지만 큰 규모의 프로젝트를 할 경우 효율적이지 못합니다. 그래서 외부 스크립트 파일을 연결해야 합니다. 2번 외부 스크립트 파일 연결하기 자바스크립트 위 텍스트를 클릭해 보세요 var heading = document.querySelector('#heading'); heading.onclick = function() { heading.style.color = "red"; } 이런식으로 분리해서 만들면 큰 규모의 프로젝트를 할 때는 훨씬 효율적입니다.

공부단 1일차-2입니다. 먼저 Visual Studio Code를 설치한 다음 작업할 프로젝트 폴더를 생성하고 해당 폴더를 Visual Studio Code로 열어 줍니다. Visual Studio Code 설치방법은 아래링크를 참고하시기 바랍니다. https://seong-jun.tistory.com/entry/Visual-Studio-Code-%EB%8B%A4%EC%9A%B4%EB%B0%A9%EB%B2%95 Visual Studio Code 다운방법 Visual Studio Code는 마이크로소프트에서 개발한 텍스트 에디터입니다. 자세한 설명은 나무위키에 나와있으니 참고하시기 바랍니다. https://namu.wiki/w/Visual%20Studio%20Code Visual Studio Code - ..

공부단 1일차-1입니다. 웹 프로그래밍이란 웹 브라우저와 관련된 프로그래밍을 작성하는 것입니다. 웹 사이트가 작동하는 과정은 서버와 클라이언트가 정보를 주고받으며 사용자에게 내용을 보여줍니다. 서버: 사용자의 요청을 처리해 정보를 전달해 주는 역할 (백엔드 개발(back-end)) 클라이언트: 서버가 전달한 정보를 웹 브라우저 화면에 보여주는 역할 (프론트엔드 개발(front-end)) 웹 프로그래밍에서 가장 많이 쓰이는 언어는 자바스크립트입니다. 자바스크립트로 할 수 있는 것들 동적인 웹 사이트를 만들 수 있습니다. 웹 브라우저에서 실행되는 프로그램을 만들 수 있습니다. 서버용 프로그램을 만들 수 있습니다. 자바스크립트의 특징 모든 웹 브라우저에서 작동합니다. 웹 브라우저에서 실행결과를 즉시 확인할 수..