본문 바로가기

programming study/JavaScript

(186)
[코드잇] 프로그래밍 핵심 개념 in JavaScript (1)(2021.2.12) 본 내용은 해당 강의 토대로 작성 자료형 01. 숫자형 숫자형태의 자료형 일반적인 사칙연산의 우선순위 규칙을 따른다. // 덧셈 console.log(1 + 2); // 뺄셈 console.log(2 - 1); // 곱셈 console.log(2 * 3); // 나눗셈 console.log(5 / 2); // 나머지 console.log(7 % 3); // 거듭제곱 console.log(2 ** 3); 02. 문자열 기본 글자를 값으로 표현하는 자료형 같은 짝 따옴표로 둘러싸서 표현 03. 문자열 활용 역슬래시를 사용하면 따옴표 안에서 따옴표를 사용 가능 백틱(`)을 사용하면, 안의 문자열을 따옴표를 포함하여 그대로 출력한다. 문자열끼리의 덧셈(+)은 문자열을 연결한다. console.log("I\'m ..
[코드잇] 프로그래밍 시작하기 in JavaScript (2021.2.12) 본 내용은 해당 강의 토대로 작성 프로그래밍 맛보기 01. 세미콜론 프로그래밍 언어의 마침표 문장 끝에 사용 JavaScript, C, C++. Java 등 생략하면 오류가 발생할 가능성이 있다. 02. 코멘트 주석, comment 어떤 의도로 코드가 작성 되었는지 설명 구현한 코드가 어떤 동작을 하는지 기록 컴퓨터가 읽지 않게 한다. 필요한 만큼, 간결하게 사용할 것 예시 // 15를 출력하는 코드 console.log(10 + 5); console.log(3 * 5); /* 여러줄 주석을 쓸 수도 있다. */ 03. 자료형 개요 프로그래밍이란? 컴퓨터로 복잡한 계산을 하는 것 자료형 (Data type) 다양한 값들의 유형 숫자 (Number) 정수 (Integer) -8, -6, -1, 0, 5, ..
[프로그래머스] Hello, JavaScript: 자바스크립트 입문 (2) (2021.1.29) 본 내용은 해당 강의 토대로 작성 Part6. Array 1. 배열 만들기 배열 값을 저장할 수 있는 엘리먼트(변수)의 연속된 공간. 주소(index)를 이용해 각 엘리먼트에 접근 가능. 배열 정의 빈 배열 : var arr = [ ]; 초기화된 배열 : var arr = [1, 2, 3, 4, 5]; 어떤 자료형이든 저장가능 var mixed_arr = [1, true, 3.14, "string", {name : "object" }, [1, 2, 3] ]; 배열 길이 .length 사용 배열 접근 대괄호 안에 인덱스 사용 arr[index]; 인덱스는 0부터 센다. 2. 배열 사용하기 배열 엘리먼트 추가 / 삭제 .push(element) : 배열의 뒤에 엘리먼트 추가 .pop(): 배열의 뒤에서 엘리..
[프로그래머스] Hello, JavaScript: 자바스크립트 입문 (1) (2021.1.28) 본 내용은 해당 강의 토대로 작성 Part 1. 시작하기 1. 실습환경 만들기 사용 에디터 : sublimetext 브라우저 : chrome JavaScript HTML, CSS와 함께 client side 웹 프로그램을 작성할 수 있다. 별도의 개발환경이 필요 없다. 웹 브라우저에서 실행할 수 있다. 기존 언어들보다 상대적으로 문법이 쉽다. 웹에 interactive한 기능을 줄 수 있다. alert 특정 메시지를 브라우저 경고창에 출력한다. alert("출력할 문구"); HTML과 연결하기 this is basic HTML page head 태그에 script태그로 연결 2. Developer Console 사용하기 Developer Console(개발자 도구) 브라우저에서 제공하는 개발들을 위한 도..
[인프런 - 정재남] Javascript 핵심 개념 알아보기 - JS Flow (3)(2021.1.26) 본 내용은 해당 강의 토대로 작성 1. 클로저 닫힘 / 폐쇄 / 완결성 함수와 그 함수가 선언될 당시의 lexical environment의 조합, 현상 실행 컨텍스트 A의 내부에서 함수 B를 선언한 상황에서 실행 컨텍스트 A와 함수 B가 콤비가 되어 무엇인가를 한다. 함수 B의 입장에서는 outerEnvironmentReference가 실행 컨텍스트 A의 environmentRecord를 참조한다. 컨텍스트 A에서 선언한 변수를 내부함수 B에서 접근할 경우에만 발생하는 특수한 현상 예시 1 var outer = function () { var a = 1; var inner = function () { console.log(++a); }; inner(); } outer(); LexicalEnvrionme..
[인프런 - 정재남] Javascript 핵심 개념 알아보기 - JS Flow (2)(2021.1.23) 본 내용은 해당 강의 토대로 작성 1. this VariablEnvironment environmentRecord (snapshot) outerEnvironmentReference (snapshot) inner LexicalEnvironment environmentRecord outerEnvironmentReference ThisBinding outer 전역 컨텍스트 ThisBinding은 실행 컨텍스트가 활성화 될 때 일어난다. 함수가 호출 될 때 this가 결정된다. 호출하는 방식에 따른 ThisBinding 전역공간에서 함수 호출시 메소드 호출시 callback 호출시 생성자함수 호출시 전역공간에서 처음부터 호출이 되어있으므로 정해져 있다. 전역객체를 가르킨다. 전역객체 : 개념상으로 전역 컨텍스트..
[인프런 - 정재남] Javascript 핵심 개념 알아보기 - JS Flow (1)(2021.1.22) 본 내용은 해당 강의 토대로 작성 Intro ES6 이전 까지의 Javascript 전체를 관통하는 핵심 개념들에 대해서 전반적인 흐름을 살펴본다. 1. Data Types Primitive Type : 기본형 Number String Boolean null undefined Reference Type : 참조형 Object Array Function RegExp 메모리의 측면에서 이해하기 Primitive type var a; a = 'abc'; a ='avcdef'; 주소 … 1002 1003 1004 1005 … 데이터 이름: a 값: @5004 -> @5005 주소 … 5002 5003 5004 5005 … 데이터 'abc' 'avcdef' 변수 'a'가 선언되면, 메모리 안에 데이터가 담길 공간..
[노마드코더]바닐라 JS로 크롬 앱 만들기 (5)(2021.1.20) 본 내용은 해당 강의 토대로 작성 Make My First JS APP 1. Image Background APP에 배경화면을 출력하는 기능을 넣는다. APP이 가지고 있는 이미지를 페이지를 들어올 때 마다 무작위로 보여준다. Math JavaScript의 모듈 수식에 관련된 기능을 사용할 수 있다. Math.random() 난수 생성 소수점이 포함된 상태로 출력된다. 범위를 지정하려면 * 숫자 를 붙여준다. Math.random( ) * 5 0 ~ 5 사이의 난수 생성 (5 제외) Math.floor() 괄호 안의 숫자의 소수를 없앤다. 버림 처리한다. Math.floor( 3.14 ) 3으로 버림 Math.ceil() 괄호 안의 숫자의 소수를 없앤다. 올림 처리한다. Math.ceil( 3.14 ) ..