JavaScript - 변수
안녕하세요, 미래의 코딩 슈퍼스타! ? JavaScript 변수의 세계로 도약하는 흥미로운 여정에 환영합니다. 여러분의 친절한 이웃 컴퓨터 과학 교사로서, 이 기본 개념을 안내해드리는 것을 기쁘게 생각합니다. 그럼 마음의 가상 캡을 쓰고, 함께 빠져들어 보겠습니다!
JavaScript 변수
상상해 보세요, 파티를 준비하고 있습니다(어떤 사람이 좋은 코딩 파티를 좋아하지 않을까요?). 모든 중요한 정보를 저장할 곳이 필요합니다 - 예를 들어, 피자를 몇 개 주문해야 할지, 누가 올지, 무슨 게임을 할지 등. JavaScript에서 변수는 파티 계획에 필요한 저장 컨테이너와 같습니다. 그들은 우리의 프로그램이 작동하기 위해 필요한 데이터를 保持합니다.
간단한 예를 시작해 보겠습니다:
let partyGuests = 10;여기서 우리는 partyGuests라는 변수를 생성하고, 그에 10을 할당했습니다. 이는 "우리는 10명의 손님을 기대하고 있습니다"라고 스티cky 노트에 적는 것과 같습니다.
JavaScript에서 변수 선언
이제 이러한 변수를 실제로 어떻게 생성하는지에 대해 이야기해 보겠습니다. JavaScript에서는 변수를 선언하는 세 가지 방법이 있습니다:
-
var- 오래된 방법(아직 작동하지만 몇 가지 이상한 점이 있습니다) -
let- 새로운 cool한 아이(변할 수 있는 변수에 사용하세요) -
const- 변치 않는 보호자(변하지 않는 변수에 사용하세요)
그들을 실제로 보겠습니다:
var oldSchoolCool = "저는 var 변수입니다";
let modernAndFlexible = "저는 let 변수입니다";
const rockSolid = "저는 const 변수입니다";var은 할아버지의 винил 레코드를, let은 다시 쓸 수 있는 CD를, const는 절대 바꾸고 싶지 않은 당신의 좋아하는 노래로 생각해 보세요.
변수 초기화를 위한 할당 연산자
수학 수업에서 본 = 기호를 기억하시나요? JavaScript에서는 할당 연산자라고 부릅니다. 이는 우리의 변수에 값을 넣는 마법의 지팡이입니다:
let magicNumber; // 선언
magicNumber = 42; // 초기화
// 또는 두 가지를 동시에 할 수 있습니다:
let theAnswerToEverything = 42;Pro tip: 항상 변수를 초기화하세요. 이는 친구들을 초대하기 전에 냉장고에 음식을 넣는 것과 같은 것입니다!
JavaScript 데이터 타입
JavaScript는 변수에 저장할 수 있는 데이터 타입에 대해 매우 유연합니다. 다음은 주요 타입입니다:
| 데이터 타입 | 예시 | 설명 |
|---|---|---|
| Number | let age = 25; |
수치 값 |
| String | let name = "Alice"; |
텍스트 |
| Boolean | let isAwesome = true; |
참/거짓 값 |
| Undefined | let mystery; |
값이 없는 변수 |
| Null | let emptyBox = null; |
의도적으로 빈 변수 |
| Object | let person = {name: "Bob", age: 30}; |
복잡한 데이터 구조 |
| Array | let fruits = ["apple", "banana", "cherry"]; |
항목 목록 |
그들을 실제로 보겠습니다:
let myAge = 30;
let myName = "JavaScript 닌자";
let canCode = true;
let futureSkill;
let emptyMind = null;
let myProfile = {job: "코더", hobby: "커피 마시기"};
let myTodoList = ["JS 배우기", ".awesome 것 만들기", "세상을 바꾸기"];
console.log(typeof myAge); // 출력: number
console.log(typeof myName); // 출력: string
console.log(typeof canCode); // 출력: boolean
console.log(typeof futureSkill); // 출력: undefined
console.log(typeof emptyMind); // 출력: object (JavaScript의 이상한 점!)
console.log(typeof myProfile); // 출력: object
console.log(typeof myTodoList); // 출력: object (배열은 특별한 객체입니다)JavaScript 변수 이름(식별자)
변수를 이름지키는 것은 반려동물을 이름지키는 것과 같습니다 - 규칙이 있지만 창의적이 olabilir! 다음은 주요 규칙입니다:
- 문자, 밑줄(_), 또는 달러 기호($)로 시작
- 문자, 숫자, 밑줄, 또는 달러 기호를 포함할 수 있습니다
- 대소문자를 구분합니다 (myVar ≠ myvar)
- 예약어(예:
let,const,function등)를 사용할 수 없습니다
좋은 예시:
let camelCase = "나는camelCase라는 이름을 가지고 있습니다";
let _underscoreFirst = "나는 밑줄로 시작합니다";
let $dollarSign = "나는 달러 기호를 가지고 있습니다";
let mix123 = "나는 문자와 숫자의 혼합입니다";좋지 않은 예시:
let 123abc = "나는 숫자로 시작하므로 유효하지 않습니다";
let my-variable = "하이픈은 변수 이름에 허용되지 않습니다";
let let = "나는 예약어이므로 사용할 수 없습니다";JavaScript 달러 기호($)와 밑줄(_)
달러 기호($)와 밑줄(_)는 JavaScript의 특수 문자입니다. 그들은 자주 라이브러리 이름이나 특수 목적으로 사용됩니다:
let $_$ = "나는 유효한 변수 이름이지만 이상하게 보입니다";
let _privateVariable = "나는 자주 사적인 변수로 사용됩니다";
let $jQueryObject = "나는 자주 jQuery 객체를 나타내기 위해 사용됩니다";JavaScript에서 정의된 변수 값
변수를 선언한 후 초기화하지 않으면, 그 변수는 undefined라는 특별한 값을 가집니다:
let myFuturecar;
console.log(myFuturecar); // 출력: undefined
// 이는 null과 다릅니다:
let myEmptyGarage = null;
console.log(myEmptyGarage); // 출력: nullundefined은 "나는 여기에 값을 까먹었다"고 생각하고, null은 "나는 이를 의도적으로 비워뒀다"고 생각하세요.
JavaScript 변수 범위
JavaScript에서 범위는 닌자의 시각성과 같습니다. 일부 변수는 어디서나 볼 수 있습니다(전역 범위), 반면에 다른 변수는 특정 영역에서만 볼 수 있습니다(지역 범위).
let globalNinja = "나는 어디서나 볼 수 있습니다!";
function stealthMission() {
let localNinja = "나는 이 함수 내에서만 볼 수 있습니다";
console.log(globalNinja); // 이는 작동합니다
console.log(localNinja); // 이도 작동합니다
}
console.log(globalNinja); // 이는 작동합니다
console.log(localNinja); // 이는 오류를 발생시킵니다 - localNinja는 여기서 정의되지 않았습니다기억하세요, 라스베이거스에서 일어나는 일... 즉, 함수 내에서 일어나는 일은 함수 내에서만 머무릅니다(명시적으로 반환하지 않는 한).
그리고 여러분, 내 코딩 제자! 여러분의 JavaScript 기술이 한 단계 업그레이드되었습니다. 연습이 완벽을 만들어 냅니다, 그러니 계속 코딩하고 실험하세요. 언제 그때, 여러분은 프로 circque 공연자처럼 변수를 제스처로 보일 수 있을 것입니다! ??♀️
행복하게 코딩하세요, 그리고 변수들이 여러분의 편이 되길 바랍니다! ?✨
Credits: Image by storyset