함수 함수는 ①특정 작업을 수행하도록 설계된 코드 블록에 ②이름을 붙인 것이다. 이름을 붙인 이유는 호출하기 위해서이다. 즉 함수는 재사용하기 위해 호출될 수 있는 코드 블록이다. '무언가'가 호출하면 함수가 실행된다. 1. 왜 함수를 쓰는가 코드를 재사용(reuse) 하기 위해서이다. 코드를 한 번 정의해 두고 여러 번 사용하기 위해서이다. 데이터에 이름을 부여하는 것이 변수라면, 코드에 이름을 붙이는 것이 함수이다. 구분 변수 함수 차이점 데이터에 이름을 부여 코드에 이름을 부여 let number = 3 function sayHi(){ console.log("Hi") } sayHi() 반드시 함수를 호출해야 한다 공통점 함수 이름에는 문자, 숫자, 및 특수 기호 2개($_)가 사용된다 괄호 안에 쉼..

반복문 반복문 은 비슷하거나 동일한 구문을 반복해서 수행해 주는 구문이다. 반복문의 종류(Different Kinds of Loops) 종류 내용 while 문 명시된 조건이 true 인 동안 코드를 실행한다. for 문 지정한 수만큼 반복한다 for/in 반복 ← 객체의 속성을 통해(the properties of an object) for/of 반복 ← 반복 가능한 객체의 값(the values of an iterable object) do/while 반복 ← 지정된 조건이 참인 동안(while a specified condition is true) 반복문의 대표적 두 가지 while 문 for 문 두 반복문은 구조 및 동작 방식에서 차이가 있다. while 문 while문은 주어진 조건이 참일 동안..

자바스크립트 조건문 조건문이라는 주어진 조건에 참 또는 거짓 여부에 따라 각각 다른 할 일을 정의하는 구문이다. 여기서 조건은 boolean 데이터를 반환하거나 또는 boolean 데이터로 해석될 수 있는 연산식이다. 조건문 = 제어문 통사론(Syntax) 내용 if문 if(조건) { 참일 때 할 일 } 조건이 참일 때 할 일 if-else문 if(조건) { 참일 때 할 일 }else{ 거짓일 때 할 일 } 조건이 참일 때 할 일을+ 조건이 거짓일 때 할 일 else는 if에 종속적이다: else만으로 따로 구문을 만들 수 없다(if에 붙여서만 가능하다) if는 소문자로 써야 한다: 대문자(If 또는 IF)로 쓰면 JavaScript 오류가 표시된다. if 문 if 문은 가장 일반적인 형태의 조건문이다...

자바스크립트 비교 연산자 비교 연산자는 주어진 2항을 비교한다. 주어진 2항을 비교해서 큰지 작은지 또는 같은지 다른지 여부를 계산하기 때문에, 비교하는 작업 은 자바스크립트에서는 연산의 일종이다. 비교 연산의 공통적 특징 비교 연산식은 항상 불리언 데이터를 반환한다. 비교(대소 비교 혹은 가 비교)는 하나의 질문이다. 자바스크립트는 질문에 대하여 참 또는 거짓으로 대답한다. (예시) 2가 3 보다 크냐? false! 4와 4가 같니? True! 비교 연산식의 결과는 언제나 boolean 데이터이다. 1. 대소 비교 반드시 부등호가 등호보다 앞에 쓰여야 한다. 구분 연산자 내용 사용사례 대소비교 > 크다(greater than) A>B =B

document, 메소드(methods) Window의 document는 DOM에 진입하기 위한 인터페이스(interface)이다. 브라우저 객체 Window의 document: 지금 브라우저에 렌더링 되고 있는 문서를 의미하는데, Window의 document 속성을 이용하여 이 문서에 접근이 가능하다.| Window의 document를 이용하여 웹페이지의 정보를 얻고, 요소(elements)의 변경 등 문서를 조작할 수 있다. 문서 인터페이스 기능 도큐먼트는 문서(html, xml, svg 등)에 대한 공통의 속성과 메소드를 제공한다. 다양한 API(Application Programming Interface)를 제공한다. 도큐먼트가 제공하는 속성과 메소드는 그 종류가 많다. 요소 선택에 필요한 메소..

DOM이란 웹페이지가 로드될 때 브라우저가 생성하는 문서 객체모델(DOM: Document Object MODEL) 웹브라우저는 html문서를 로딩한 후 그 내용을 해석해서 화면에 보여준다. 그 과정이 렌더링이다. 렌더링 하는 과정에서 코드 해석 과정 해석 과정에서 브라우저는 html 요소들을 트리 형태로 구조화한다. 이를 문서 객체(DOM: Document Object MODEL = 문서 객체모델)이라 하는데, 결국 브라우저는 이 DOM을 토대로 화면에 웹 콘텐츠들을 렌더링 하는 것이다. 트리 형태란: 가장 상위 태그가 html태그이다. html 코드들은 한 태그가 다른 태그를 포함하는 형태이다. 요소가 다른 요소 안에 포함되는 형태가 트리 형태의 계층 구조를 이룬다. html은 body의 부모이고 ,..

연산자 연산이란 '식이 표시하는 일정 규칙에 따라 계산'하는 것을 말한다 산술 연산은 두 항의 계산 결과를 반환한다. 대입 연산은 항상 오른쪽 항이 먼저 계산되어 왼쪽 항에 대입한다. 주로 변수 초기화에 사용된다. 연산자가 여러 개 사용되는 경우 우선순위가 적용된다. 1. 산술 연산자 연산자(Operator) 의미(Description) 예제 + 더하기/ Addition 2+3=5를 반환 - 빼기/ Subtraction 6-2=4를 반환 * 곱히가/ Multiplication 3*4=12 ** Exponentiation () / 나누기/ Division 2/4=2 % 나머지/ Modulus (Division Remainder) 12%5=2 ++ Increment -- Decrement 2. 대입 연산자 ..

템플릿 리터럴 문자열 안에 데이터 표현식을 삽입할 수 있는 표현법이다. 백틱(`)을 이용한 표헌 백틱은 물결 키(~)를 shift 누르지 않고 누르면 입력 가능하다. 변수나 메소드 모두 템플릿 리터럴에 삽입될 수 있다. 기존문자열과 차이점 기존 문자열 템플릿 리터럴 차이점 문자열 안에 표현식을 삽입할 수 있다 = 문자열의 내용에 데이터 삽입 가능 달러 사인($)과 플레이스 홀더({})를 기입 문자열 안에 달러 사인($)과 플레이스 홀더({})를 기입하고 그 안에 데이터를 기입하면 된다. 그 데이트는 문자열의 일부가 된다. 예시 입력 내용 아래 코드표: 변수이므로 값의 변경이 가능하다. let lit = "따옴표" console.log(lit); str = `백틱 백틱` console.log(lit); 콘..

1. 상수 상수는 변하지 않는 값이다. constant의 약자이다. constant: 변함없는, contancy: 불변성 변수와 상수의 차이점과 공통점 차이점과 공통점 변수 상수 차이 변하는 값 변하지 않는 값 값은 변할 수 있다. 단 하나의 값(데이터)을 위한 것 값(데이터)의 변경 불가 선언과 초기화를 ①따로 해도 되고 ②동시에 해도 된다. 선언과 초기화를 ②동시에 해야 한다. (하나의 구문으로 1번에 처리) const x = 데이터; 공통점 지정된 데이터 대신 사용 가능 이름 짓기 규칙 let 이름 = 데이터; 이름 짓기 규칙 let 이름 = 데이터; 선언과 초기화를 동시에 해야 한다. 선언과 초기화를 따로 하면 아래 그림처럼 오류가 난다. const aa; aa=10; console.log(aa)..

변수란 변수란 변할 수 있는 값이다. 세상에서 가장 자주 바뀌는 것은 여자의 마음이다. 여자의 마음을 담아 두거나, 흑은 미움 같은 것, 사랑 같은 것 담아 둔다. 변수란 그런 것들을 담아두는 저장소이다. 변수란 변할 수 있는 값을 보관하는 저장소이다. (변수=변할 수 있는 값을 저장하는 데이터 저장소) 변수를 사용하는 목적 마음이 바뀌거나, 상황이 바뀌면 빨리 대처하기 위함 예시 1 입력된 데이터 let he; he = 'hate'; console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console.log(he) console...