3월 21일(화) 업데이트
4월 3일(월) 업데이트

※ 개인 학습 참고용으로 정보의 순서가 다를 수 있습니다. 해당 블로그의 내용과 순서 제목은 자주 수정될 수 있습니다. 잘못된 정보는 꼭 댓글로 남겨주시면 수정하도록 하겠습니다!

1. JavaScript이란?

대화형 웹 페이지 및 웹 응용 프로그램을 만드는 데 사용되는 프로그래밍 언어로 동적 콘텐 웹사이트에 만들 수 있습니다. JavaScript 코드는 컴파일러 없이 웹 브라우저나 서버에서 실행할 수 있어 웹 애플리케이션을 쉽고 빠르게 개발, 배포하고 DOM을 조작하는 기능을 통해 전체 페이지를 다시 로드하지 않고도 웹 페이지의 내용과 모양을 동적으로 변경할 수 있습니다.

목차

1. 주사용 표기법
   1. camelCase
   2. PascalCase

1. 주사용 표기법

camelCase

youCanDeveloper // 반드시 앞의 문자는 소문자여야 한다. JavaScript에 주로 사용

PascalCase

YouCanDeveloper // 앞의 문자를 대분자로 사용할 수 있다. 특수한 경우 사용

선언

let name = "DICEPTED"; // 'let'는 데이터가 재할당이 가능한 선언입니다.
const name = "DICEPTED"; // 'const'는 데이터가 지정되어 재할당할 수 없는 선언입니다.
var name = "DICEPTED"; // 'var'는 데이터가 재할당이 가능한 선언입니다. 최근 사용도가 줄고 있습니다.

’데이터 재할당’이란? : ‘let’의 경우 데이터 재할당이 가능하지만 ‘const’는 재할당이 가능하지 않습니다. 되도록 고정되어 있는 값을 사용하는 ‘const’를 사용하면 자바스크립트 오류를 줄일 수 있습니다.

출력 방법

console.log(); // 보이지 않는 콘솔창에서 표시됩니다.
document.write(); // 웹브라우저 화면에 바로 표시됩니다.
alert(); // 웹브라우저 화면 위에 알람참을 띄워 표시합니다. 주로 알림, 경고, 에러, 참여완료 등등 사용됩니다.

콘솔로그 출력 ⬇️

문서(웹페이지) 출력 ⬇️

알림(웹페이지) 출력 ⬇️

String(문자 데이터)

• 문자열은 ''작은따옴표 또는 ""큰따옴표로 묶인 일련의 문자입니다.

let myName = "DICEPTED"; // 'let'로 'myName' 선언하여 '=' 로 'DICEPTED' 를 연결합니다.
let email = "dicepted@naver.com"; // 'let'로 'email' 선언하여 '=' 로 'dicepted@naver.com' 를 연결합니다.

console.log(myName); // 콘솔로그로 'myName'값을 호출하여 표시합니다.
console.log(email); // 콘솔로그로 ''email'값을 호출하여 표시합니다.

*보간법

• 변수, 함수 호출, 산술 표현식을 문자열에 동적인 값을 직접 삽입 할 수있는 기능입니다.
  반드시 문자열 안에 백틱(``)을 사용해야 사용할 수 있습니다.

let myName = "DICEPTED";
let hello = `Hello ${myName}!`;

console.log(hello);

Number(숫자 데이터)

• 숫자는 정수, 소수점 값을 사용할 수 있습니다. 수학적 연산을 수행하기 위해 + - * / 등을 사용할 수 있습니다.

let number = 1234;
let opacity = 1.25;

console.log(number);
console.log(opacity);

Boolean(불리언 데이터)

• 참 또는 거짓을 나타내는 데이터 유형입니다. 특정 조건이 충족되는지에 따라 프로그램을 제어하는 데 사용됩니다. 활용 예로 ’if’문은 불리언 변수가 ‘true’인 경우 일부 코드를 실행할 수 있습니다.

let checked = true;
let isShow = false;

console.log(checked);
console.log(isShow);

Undefined(언파인드 데이터)

• 값이 없음을 나타내는 특수 값입니다. 변수가 선언되었지만 값이 할당되지 않습니다.

let undef;
let obj = { abc: 123, def: 456 };

console.log(undef);
console.log(obj.abc);
console.log(obj.def);
console.log(obj.ghi);

null(널 데이터)

• 값이 의도적으로 없음을 나타내는 특수 값입니다. 변수에 값이 없어야 하거나 값이 의도적으로 삭제되었음을 나타내는 데 사용됩니다.

let empty = null;

console.log(empty);

Object(객체 데이터)

• 키, 값 모음을 저장할 수 있는 복합 데이터 유형입니다. 객체는 {} 중괄호를 사용하여 생성되며, 꺼내 사용할 수 있습니다.

let user = { name: 'DICEPTED', age: 86, isValid: true };

console.log(user.name);
console.log(user.age);
console.log(user.isValid);

Array(배열 데이터)

• 값 모음을 저장할 수 있는 데이터 유형입니다. 배열은 순서가 있으므로 배열의 요소가 특정 순서로 저장되고 해당 인덱스를 사용하여 값을 가져와 출력할 수 있습니다.

let fruits = ['APPLE', 'BANANA', 'CHERRY'];

console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);