웹개발종합반 개발일지 | 1주차 - 12,13,14,15,16강

 

💡수업 목표💡

1. 서버와 클라이언트의 역할에 대해 이해한다.
2. HTML, CSS의 기초 지식을 이해한다. 부트스트랩을 가져다 쓸 줄 안다!
3. Javascript 기초 문법을 익힌다.

 

 

 

2022.08.11 - [스파르타코딩클럽/웹개발종합반] - 웹개발종합반 개발일지 | 1주차 - 1,2,3,4,5,6,7강

웹개발종합반 개발일지 | 1주차 - 1,2,3,4,5,6,7강

2022.08.11 - [스파르타코딩클럽/웹개발종합반] - 웹개발종합반 개발일지 | 1주차 - 8,9,10,11강

웹개발종합반 개발일지 | 1주차 - 8,9,10,11강

 

---

 

JS 기초 문법

JS는 Html, CSS와 같은 마크업 언어와 다르게 프로그래밍 언어이다.

프로그래밍은 코딩을 포함하여 전반적으로 로직을 설계하는 작업을 말하는 거고 코딩은 프로그래밍 언어를 통해서 작성하는 행위이다.

HTML, CSS는 로직을 설계하는 부분이 아니다 보니 프로그래밍 언어라고 보기 어렵지만 지금부터 배울 JS는 프로그램 로직을 짜는데 사용되는 언어이다.

프로그래밍 언어를 처음 공부하게 될 때 기초 문법으로 꼭 알아야하는 5가지가 있다.

 변수 / 자료형 / 조건문 / 반복문 / 함수.  이 5가지를 익힌다면 간단한 JS 코딩은 가능하게 된다.

 

변수

let 변수명;  // 변수 선언
let 변수명 = 값; // 변수값 할당

 

자료형

//String 문자열
let s = "hello"

//Number 숫자
let num = 100;

//Boolean 불린형
let 변수 = true or false; 

//Null 널
let a=null;

//undefined
let s; // undefined

//symbol 심볼
const symbol1 = Symbol();
const symbol2 = Symbol(42);

//object 객체
let 변수명 = [value1,value2,value3] //배열

let user = {}; //객체 생성
user{
	이름 : 값,
 name: "leehyunji",
 password : "1234",
 gender :"female"
};

 

조건문

// 기본 if문
if(조건식){
	실행 문장 1;
}else{
	실행 문장 2;
}

function is_adult(age){
	if(age > 20){
		alert('성인이에요')
	} else {
		alert('청소년이에요')
	}
}

is_adult(25)


// if ~ else if ~ else문 
if(조건식1){
	실행 문장 1;
}else if(조건식2){
	실행 문장 2;
}else{
	실행 문장 3;
}

function is_adult(age){
	if(age > 20){
		alert('성인이에요')
	} else if (age > 10) {
		alert('청소년이에요')
	} else {
		alert('10살 이하!')
	}
}

is_adult(12)

 

반복문

//for문
for (1. 시작조건; 2. 반복조건; 3. 더하기) {
	4. 매번실행
}

1 -> 2체크하고 -> (괜찮으면) -> 4 -> 3
-> 2체크하고 -> (괜찮으면) -> 4 -> 3
-> 2체크하고 -> (괜찮으면) -> 4 -> 3
-> 2체크하고 -> (괜찮으면) -> 4 -> 3

와 같은 순서로 실행됩니다.
i가 증가하다가 반복조건에 맞지 않으면, 반복을 종료하고 빠져나옵니다.



//example
for (let i = 0; i < 100; i++) {
	console.log(i);
}

 

함수

// 만들기
function 함수이름(필요한 변수들) {
	내릴 명령들을 순차적으로 작성
}
// 사용하기
함수이름(필요한 변수들);


//example
// 두 숫자를 입력받으면 더한 결과를 돌려주는 함수
function sum(num1, num2) {
	console.log('숫자', num1, num2);
	return num1 + num2;
}

sum(3, 5); // 8
sum(4, -1); // 3