🔤 Language/🟨 JavaScript

JS 조건문, 반복문

🌐 JS 랜덤 함수 export default function random() { return Math.floor(Math.random() * 10) } import getType from './getType' import random from './getRandom' // main 함수 연결 🌐 JS 조건문 if else // if else console.log('조건문 if else') const m = random() if (m < 3) { console.log(m, '< 랜덤숫자는 3보다 작다.') } else if (m === 4) { console.log(m, 'm은 4이다.') } else { console.log(m, 'm은 5 이상이다.') } 🌐 JS 조건문 switch // switc..

JS 연산자 산술/할당/비교/논리/and/or/부정/삼항

🌐 JS 산술 연산자 // 산술연산자(arithmetic operatior) console.log('산술연산자') console.log('1 + 2 = ', 1 + 2) // 1 + 2 = 3 console.log('4 - 8 = ', 4 - 8) // 4 - 8 = -4 console.log('2 * 5 = ', 2 * 5) // 2 * 5 = 10 console.log('4 / 8 = ', 4 / 8) // 4 / 8 = 0.5 console.log('7 % 5 = ', 7 % 5) // 7 % 5 = 2 🌐 JS 할당 연산자 // 할당 연산자 let a = 4 console.log(a += 1) // a = 5 console.log(a -= 2) // a = 3 console.log(a *= 2) ..

JS 형변환

🌐 JS 문법 시작 // 실행문 console.log('hello world!') // hello world console.log(123) // 123 console.log(typeof "hello world!") // string console.log(typeof 123) // number console.log(true) // true console.log(typeof null) // object console.log(typeof undefined) // undefined console.log(typeof {}) // object console.log(typeof []) // object 🌐 JS 형변환 export default function getType(data) { return Object.p..

JS Object (객체)

Object Object는 property를 가진 데이터를 저장해주며, { } 를 사용한다. const player = { name : imae, level : 100, korean : true, }; console.log(player); property를 불러오는 방법은 2가지가 있다. console.log(player.name); // imae console.log(player["name"]); // imae 또한 property를 바꾸는 것은 가능하지만 선언된 object를 바꾸는 것은 불가능하다. const player = { name : imae, level : 100, korean : true, }; console.log(player); player.level = 101; console.log..

JS. const, let, var 차이점

Variable(변수)를 선언하는 방법 const -> 상수이므로 값을 변경할 수 없다. let -> 변수값을 변경할 수 있다. var -> 변수값을 변경할 수 있지만, 실수로 값을 업데이트해도 알아차릴 수 없다. 사용하지 말자. const와 let 사용하는 방법 const를 기본적으로 사용하자. 업데이트가 필요한 변수라면 let을 사용하자. 평소 대부분 const로 변수를 선언하자.

JS. Camelcase

Camelcase 단어가 합쳐진 부분마다 맨 처음 글자를 대문자로 표기하는 방법 길이가 긴 변수를 선언할 때 → Camelcase ex. VeryLongVariableName cf. Python에서는 very_long_variable_name

JS. JS 도구

프로젝트시, 최소한의 도구만으로 순서에 따라 실행되어야 할 명령들이 실행되어야 최소한의 지식으로 현실의 문제를 연결한다. 웹페이지가 아니라 웹브라우저 자체를 제어해야 한다면 윈도우 document 객체 페이지내의 태그 조작 DOM 객체 document 객체로도 안되는 작업은 DOM문서를 확인 window 객체 웹페이지가 아닌 웹 브라우저 자체를 제어해야 하는 경우, 확인 ex. 현재 열린 웹페이지의 주소가 필요한 경우, 새로운 브라우저 창을 열어야 할때, 브라우저 화면 크기 정보가 필요한 경우 Ajax 웹페이지를 reload하지 않고, 정보를 변경하고 싶다면 Morden web page 를 위한 필수 기술 Cookie 웹페이지가 reload되어도 status를 유지해야 할 경우, 사용자를 위한 개인화된 ..

JS. 라이브러리와 프레임워크, UI vs API

※ 생활코딩 선생님의 "라이브러리와 프레임워크" 강의를 수강하고 작성한 글입니다. library vs framework library: 부품을 가져오는 역할 - > jQuery 이용 -> CDN (Content Delivery Network) framework: 일종의 템플릿 역할 UI vs API UI User's interface for using application 사람(사용자)과 사물 또는 시스템, 특히 기계, 컴퓨터 프로그램 등 사이에서 의사소통을 할 수 있도록 일시적 또는 영구적인 접근을 목적으로 만들어진 물리적, 가상적 매개체를 뜻한다. API Programmer's Interface for programming 컴퓨터나 컴퓨터 프로그램 사이의 연결이다. 일종의 소프트웨어 인터페이스이며 다..

JS. 파일로 쪼개서 js코드 관리

※ 생활코딩 선생님의 "파일로 쪼개서 정리 정돈하기" 강의를 수강하고 작성한 글입니다. js 코드만 따로 관리하는 법 js 코드만 따로 관리할 때 장점 프로그램 유지관리보수의 편리 서버 비용 절감 트래픽 절감 캐시

JS. 객체

※ 생활코딩 선생님의 "객체 활용" 강의를 수강하고 작성한 글입니다. 객체 프로퍼티 메소드 용어 정리 객체(Object) 이름과 값으로 구성된 성질(property)의 정렬되지 않은 집합입니다. 프로퍼티(property) 객체에 소속된 변수 메소드(method) 객체에 소속된 함수 위 코드와 같이 객체를 사용하기 전에 함수로 중복을 정리해주는 작업을 했다. 객체 생성 방법 Create 이러한 결과로 모든 객체가 생성되는 것을 볼 수 있다. 반복문 Interate 반복문을 사용하는 법 for(var key in coworkers) key programmer, designer 등 coworkers[key] egoing, leezche 등 메소드 생성 방법 메소드란? 객체에 소속된 함수 객체 활용 Body와 ..