🔗 프로그래밍 언어의 구성요소

식과 값 그리고 문..

예를 들어, 1 + 1 = 2의 계산이 있으면 1 + 1은 식이고 2는 값이다. 그리고 사이에 있는 = 은 문이다. 프로그래밍 언어는 값과 식으로 이루어져 있고 식은 문을 지나 값이 된다. 즉, 식은 반드시 값이 된다. 문의 역할은 값을 바꿔주는 역할 혹은 실행의 흐름을 결정해준다.

📌 '문'의 역할은 실행?

하드디스크에 있는 정보를 컴퓨터가 이해할 수 있는 구조로 변경하고 이 변경이 메모리(RAM)에 저장된다. 이 단계를 적재(Feche)한 후, REM에서 CPU로 한줄씩 전달한다.

브라우저로 생각해보자 !

브라우저에는 js엔진이 있다(CPU역할). 네트워크 망을 통해 하드디스크(물리적인 서버(소스타임))에 있는 js파일을 요청하고 하드디스크에서 js를 전송한다. 네트워크 망을 통해 브라우저에서 받아서 실행(run)한다. 이렇게 실행되고 있는 시간은 runtime이고 프로그래밍 언어가 동작하는 환경이라 할 수 있다.

🔗 JavaScript 값의 종류

• 숫자number = 123,

• 문자string = 쿼테이션, 어퍼스트로피, 백틱으로 감싸진 형태

• 불리언boolean = true, false 참과 거짓 2가지의 값

• Null - 어떤 값이 의도적으로 비어있음

• undifined - 값이 지정되어있지 않음
  📌 undifined 와 null은 의도적이냐, 의도적이지 않느냐로 구분한다.

• object (객체 데이터) { key : value } 형태로 저장되는 데이터의 집합

• array (배열 데이터) [ ] 여러 데이터를 순차적으로 저장

• 변수 - 데이터를 저장하고 참조하는 데이터의 이름 var, let, const
  let - 재사용이 가능하며 변수를 선언한다. 값(데이터)의 재할당 가능.
  const - 상수를 선언한다. 값(데이터)의 재할당 불가.

• 예약어 - 특별한 의미를 가지고 있어, 변수나 함수 이름 등으로 사용할 수 없는 단어 ( this, if, break 등 )

• 함수function - 특정 동작(기능)을 수행하는 일부 코드의 집합

🔗 Function

함수를 선언할때 호출되는 부분에서 들어가는 데이터가 인수argument,
받은 데이터를 함수에서 받아줄 변수를 매개변수parameter라 한다.

📢 예시)

function add(a, b) {
	return a + b
}
console.log(add(2, 5));

add 함수에 넣을 값 2와 5가 Agument, 함수 안으로 들어가 값을 받는 a와 b가 Parameter가 된다.

• 이름이 있는 함수 (기명함수) function hello ( ){ } 함수를 선언한다.
• 이름이 없는 함수 (익명함수) let hello = function( ){ } 함수를 표현한다.

🔗 Method

객체 안에 하나의 함수를 표현(익명함수)하고 있는 변수

• 메소드체이닝 - 메소드를 붙여서 작성하는 것
  // split(' ') : 문자를 인수 기준으로 쪼개서 배열로 반환
  // reverse() : 배열을 뒤집기
  // join(' ') : 배열을 인수 기준으로 문자로 병합해 반환
  => const b= a.split(' '). reverse( ). join(' ');

🔗 DOM API

Document Object Model / Application Programming Interface
웹사이트가 동작하기위해서 입력하는 프로그래밍 명령
Document(HTML) = 자바스크립트에서 HTML을 제어하는 여러가지 명령들

• document . querySelectorAll( ) - html 요소 모두 찾기
• boxEl . forEach ( function (boxEl, index) { } ) 찾은 요소들을 반복해서 함수 실행, 익명 함수를 인수로 추가
  boxEl 첫번째 매개변수 - 반복중인 요소
  index 두번째 매개변수 - 반복중인 번호
• classList.add 각각의 클래스에 내용 추가
• addEventListener (" 이벤트 " , function( ){ } //핸들러 )