🌟] 프로그래밍 기초 in JavaScript

console.log('Hello Codeit!');

해당 게시물은 '코드 잇' 의 '프로그래밍 기초 in JavaScript'를 공부하며 작성한 노트 입니다.

불완전한 게시물 이므로 언제든지 비공개로 전환될 수 있습니당

 

0. 코멘트 혹은 주석

// 코드를 작성하다 중간중간 작성
// 본인이 작성한 로직을 설명하기 위하여
//구현한 코드가 어떤 동작을 하는지 설명할 때

// 슬래쉬 두 개는 한 줄 코멘트

/* 
	슬래쉬별 과 별슬래쉬는 다중 줄 코멘트
*/

 

1. 자료형(Data type)

가). 숫자형(Number)

- 기본 적으로 사칙연산 가능

 i). 정수(Integer) vs ii). 소수(실수)(floating point)

//정수
1, 2, 3, 6, -1 ,-4
//소수
3.14, -1.72, 0.613

 

나). 문자열(String)

- '+' 기호를 이용해 문자열 연결이 가능

"코드 잇"
'코드 잇'

-  '(작은 따옴표)  혹은  "(큰 따옴표)  한 종류로만 문장을 감싸야 하며 문장의 중간에 처음 선택한 따옴표와 같은 종류의 따옴표를 쓰길 희망할 경우엔 \(역슬래쉬) 를 이용해야 함

" 예수께서 대답하여 이르시되 \"이 물을 마시는 자마다 다시 목마르려니와 내가 주는 물을 마시는 자는 영원히 목마르지 아니하리니 내가 주는 물은 그 속에서 영생하도록 솟아나는 샘물이 되리라\" 요한복음 3: 16" 

 

다). 불린(논리형)(Boolean)

- true 와 false 를 나타내기 위하여 사용

- 조건에 대한 '결과 값'으로 이용

 

2. 추상화 개요

- 목적은 명확하게, 불필요한 정보를 숨기고 꼭 필요한 핵심만 표현

- 복잡한 것들을 목적에 맞게 단순화하는 것

 

 

3. 변수

- 반복적으로 사용되는 데이터를 꺼내쓰기 위한 이름이 붙은 상자

- 변수에 값을 넣어주기(할당) 위해선 '='을 사용 (프로그래밍에서 = 은 같다 라는 의미가 아닌 할당 연산자로 사용)

let coffePrice = 4000;
let myName = 'J4BEZ';

console.log('커피 두 잔의 가격은' + (2 * coffePrice) + '원 입니다.');
console.log('안녕하세요, 작은 고양이' + myName + ' 입니다.');

 

4. JavaScript 변수 작명 가이드

- 필수 -

1. 모든 식별자는 '문자(a~z, A~Z)', '밑줄(_)' 혹은 '달러 기호($)'로 시작해야 함.

 - 두 번째 글자부터 '숫자(0-9)'도 가능

2. '대문자'와 '소문자'는 구별함

3. '예약어(JavaScript가 미리 찜해놓은 단어)'는 사용하면 안됩니다. ex). if, for, let, var 등등

//1. 식별자의 첫 글자는 문자, 밑줄, 달러 기호
//숫자는 두 번째 글자 부터 가능
let Jesus; //O
let cross; //O
let _hide; //O
let $sacrifice; //O

let 안녕; //X
let 3cupOfCoffee; //X

//2. 대소문자 구분
myname != myName

//3. 예약어는 사용불가
let for; //X

 

- 권장(이지만 필수) -

여러 사람이 협업할 때 일관성 있는 코드를 쓰기 위해선 어느 정도의 약속이 필요

 

1). 의미 없는 이름은 사용 지양하기

- 코드의 가독성이 떨어지고 활용이 어려움, 해당 변수가 무엇을 의미하는지 이해하기 힘듦

 

2). 너무 추상적인 이름 지양하기

- 거대한 프로그램을 작성시엔 겹치는 개념이 많을 수 있기 때문에 지나친 추상적 이름은 피하는게 좋음

ex). 교내 프로그램 제작시 name이 변수명일 경우 그 것이 학생의 이름을 의미하는지 교수님의 이름을 의미하는지 아니면 전혀 다른 무언가의 이름을 지칭하는지 쉽게 예상할 수 없음

 

3). camelCase('카멜 명명법') 강추

변수명에는 띄어쓰기가 불가능하기 때문에 띄어쓰기 역할을 대신 할 무언가가 필요

 

-> 그 중하나가 첫 번째 단어는 소문자로 하고, 그 이후 띄어쓰기가 있는 다른 단어가 등장할때 각 단어의 첫 문자를 대문자로 표기하는 방식

let bad_variable_name; // C++ 등에서 주로 애용되었던 방식
let goodVariableName; // 추천 방식

 

추천 가이드 사이트

parksb/javascript-style-guide

 

Google JavaScript Style Guide

 

JavaScript Style Guide

JavaScript는 권장 들여쓰기가 2칸

 

 

5. 함수(function)

- 변수 = 값 저장, 함수 = 명령들 저장,

//함수 선언
function 함수이름() {
    명령;
    명령;
};

복잡한 내용은 숨기고 핵심만 드러내는 함수 또한 추상화의 개념이 적용됨을 인지가능

 

 

6. 파라미터(Parameter)(매개변수)

- 함수 호출시 (소괄호)안에 들어가는 값

//함수 선언
function 함수이름(파라미터){
	console.log(파라미터);
}

//함수 실행
함수이름(값);
//-> console.log(값);



function welcome(name) {
 console.log('안녕하세요 ' + name + '님!');
 }
 
 welcome('J4BEZ');
 //안녕하세요 J4BEZ님!

 

- 여러개의 파라미터를 입력하는 법

: ','(쉼표)로 구분해주면 여러 개의 파라미터를 입력가능

//함수 선언
function 함수이름(파라미터1, 파라미터2){
	console.log( 파라미터1 + 파라미터2 );
}

//함수 호출
함수이름(1, 7);

 

 

7. return문

- 함수에서 결과 값을 반환할 때

function getTwo(){
	return 2;
}

console.log(getTwo());
// 2

function getTwice(number){
	return 2 * number;
}

console.log(getTwice(5));
//10