공부 기록일지📚

User Interface(UI) ->일반사용자가 사용하여 어플리케이션(웹브라우저 등)을 제어 간단히 말하자면 사용자 접점 Application Programming Interface(API) ->alert()등의 명령어로 알림창을 띄우는 것 등 개발자가 주 사용자 애플리케이션을 프로그래밍하기 위한 개발자의 접점 레퍼런스와 튜토리얼 프로그래밍을 공부하기 위한 두 가지 큰 자료(reference & tutorial ) 튜토리얼(tutorial) - 언어의 문법 설명 레퍼런스(reference) - 명령어의 사전 자바스크립트의 API는 크게 자바스크립트 자체의 API와 자바스크립트가 동작하는 호스트환경의 API로 구분 자바스크립트의 호스트환경에 대한 API -> 웹 브라우저, node.js *ECMAScri..

모듈화(파일로 분리하기)를 통해 얻을 수 있는 효과 자주 사용되는 코드를 별도의 파일로 만들어서 필요할 때마다 재활용할 수 있다. 코드 수정 시에 필요한 로직을 빠르게 찾을 수 있다. 필요한 로직만을 로드해서 메모리의 낭비를 줄일 수 있다. 한 번 다운로드된 모듈(JS)은 웹브라우저에 의해서 저장되기 때문에 동일한 로직을 로드할 때 시간과 네트워크 트래픽을 절약할 수 있다.(브라우저에서만 해당) 모듈이란? 순수한 자바스크립트에서는 모듈(module)의 개념이 분명하게 존재하지 않는다. 자바스크립트가 구동되는 호스트 환경에 따라서 서로 다른 모듈화 방법이 제공됨 모듈은 프로그램을 구성하는 작은 부품으로 이해하면 쉽습니다. ->자바스크립트의 대표적인 호스트 환경인 웹 브라우저에서 로직을 모듈화하는 방법에 대..

객체(Object)는 데이터를 담아내는 컨테이너라는 점에서 배열과 아주 유사하다. 가시적인 차이가 있다면 배열은 중복되지 않는 인덱스(색인)이 데이터가 추가될 때마다 자동으로 지정되지만 객체는 배열에서 자동으로 지정되는 '인덱스'를 직접 지정할 수 있다. //인덱스를 문자열로 지정하고 싶다면 객체를 사용하면 됩니다. *다른 언어에서 연관배열(associative array) 또는 맵(map), 딕셔너리(Dictionary)라는 데이터 타입이 객체에 해당합니다. 객체의 생성 배열은 [] 대괄호로 여닫지만 객체는 {}중괄호로 여닫습니다. 구분은 콤마로 합니다. 객체는 key : value 로 이루어져 있습니다. // 아래 코드에서 key는 cong, vella, sollar 가 되겠죠 const grades..

배열(Array)이란 연관된 데이터를 모아서 통으로 관리하기 위해서 사용하는 데이터타입이다. 변수가 하나의 데이터를 저장하기 위한 것이라면 배열은 여러 개의 데이터를 하나의 변수에 저장하기 위한 것 기본형식: 대괄호 [ element1, element2 ... ]; let member = ['감자', '고구마', '호박']; 배열의 내부에 있는 데이터 각각을 '원소' 즉, element라고 합니다. 또한, 원소끼리의 구분은 ,(콤마)로 해줍니다. 그리고 그 원소들이 갖고있는 고유값(문맥적으론 배열의 원소가 갖고있는 순서)을 한국어로 '색인' 영어로는 index라고 합니다. index는 0부터 시작합니다. // arrayName[index] alert(member[0]); //output: '감자' 배열이..

함수(Function) - 하나의 로직을 재실행할 수 있도록 하는 것으로 코드의 재사용성을 높여준다. (유지보수의 용이, 가독성 높아짐) 기본형식 function 함수명( [인자...[,인자]] ){ 코드 return 반환값 } /*함수 numbering을 1000번 실행하라 */ //주의: 변수 앞에 let, const 를 꼭 써줘야합니다. function numbering() { let i = 0; while (i < 20) { document.write(i + ""); i++; } } for (let i = 0; i < 1000; i++) { numbering(); } 입력과 출력 return(출력) return이 하는 일은 2가지가 있습니다. return뒤에 따라오는 값을 함수의 결과로 반환 re..

▶반복문의 문법은 몇 가지가 있으며 각각의 구문은 서로 대체 가능하기 때문에 상황과 취향에 따라서 선택하여 사용하면 된다. while 기본형식 while(조건){ // 반복해서 실행할 코드 } 조건에는 당연히 Boolean데이터타입이 와야 합니다. 조건의 Boolean이 true 에서 false가 될 때까지 반복됩니다. 조건식이 계속해서 true일 경우, 무한루프에 빠지게 되며 이는 쉽게 발생할 수 있는 오류입니다. let i = 0; //초기화 while (i < 10) { document.write(`Coding EveryBody! I am number ${i + 1} `); i = i + 1;} for 기본형식 for(초기화; 반복조건; 반복이 될 때마다 실행되는 코드){ 반복해서 실행될 코드 } ..

Boolean: 비교 연산의 결과로 참이거나 거짓을 얻을 수 있다. 여기서 참(true)과 거짓(false)은 언어에서 제공하는 데이터형이다. 이를 Boolean이라 부르고 불린은 위에 말한 두 가지 밖에 없다. 참과 거짓에 따라 조건문을 실행하기도 안하기도 하기 때문에 조건문에서 핵심적인 역할을 담당한다. if문 if(true){ alert(1); alert(2); alert(3); alert(4); } alert(5); //output: 1~5까지 알림창 if(false){ alert(1); alert(2); alert(3); alert(4); } alert(5); //output:5만 알림창에 뜬다. else -if로는 좀 더 복잡한 상황을 처리하는데 부족하다. -else는 조건문의 반대상황에 적용..

" == " 동등연산자 (equal operator) :좌항과 우항을 비교해서 서로 값이 같다면 true 다르면 false. // 데이터타입까지 고려하지 않고 데이터가 의미하는 바가 같다면 true를 반환한다. ※ " = "는 대입 연산자로 좌항의 값을 우항의 변수에 대입할 때 사용하는 것이므로 헷갈리지 않도록 주의 alert(1==2) // false alert(1==1) //true alert("one" == "two") // false alert("one" == "one") // true " === " 일치연산자 (strict equal operator) : 좌항과 우항을 엄격하게 비교한다. 값만 비교하는 것이 아니라 데이터 타입또한 일치해야 true 아니라면 false. alert(1 ==="1"..