본문 바로가기
반응형

기획자・디자이너를 위한 넓고 얕은 개발 지식/Javascript7

8화. 자바스크립트 클래스란? 안녕하세요! 오늘은 자바스크립트에서 클래스가 무엇인지 아주 쉽게 설명해 드릴게요. 클래스를 알면, 자바스크립트로 사람, 강아지, 자동차 같은 물건을 만들고 표현할 수 있어요. 그럼 차근차근 알아볼까요?1. 클래스란 무엇인가요?클래스는 자바스크립트에서 물건이나 사람을 만드는 설계도라고 생각하면 돼요. 예를 들어, 강아지를 만들려면 강아지의 이름, 나이 같은 정보를 정해줘야겠죠? 그걸 클래스에서 미리 정해두는 거예요.2. 클래스를 왜 사용할까요?클래스를 사용하면 비슷한 물건을 쉽게 여러 개 만들 수 있어요. 한 번 클래스를 만들어 놓으면, 그걸 바탕으로 새로운 강아지나 사람 같은 여러 객체를 만들 수 있어요.3. 클래스의 기본 구조클래스는 두 가지를 정해줘요:속성: 물건이 가지고 있는 정보예요. (예: 이름.. 2024. 10. 28.
7화. 자바스크립트 화살표 함수란? 안녕하세요! 오늘은 자바스크립트에서 화살표 함수(arrow function)가 무엇인지 아주 쉽게 설명해 드릴게요. 화살표 함수는 기존 함수보다 짧고 간단하게 코드를 작성할 수 있는 방법이에요. 그럼 차근차근 알아볼까요?1. 화살표 함수란 무엇인가요?화살표 함수는 자바스크립트에서 함수를 만드는 방법 중 하나예요. 우리가 자주 쓰던 일반 함수를 더 짧고 간단하게 쓸 수 있는 방법이에요. 이름이 '화살표'인 이유는 함수 안에서 화살표(=>)를 사용하기 때문이에요.2. 기존 함수와 화살표 함수의 차이기존 함수 만드는 방법function sayHello() { console.log("안녕하세요!"); } 화살표 함수로 만드는 방법const sayHello = () => { console.log("안녕하세요!").. 2024. 10. 28.
6화. 자바스크립트의 함수란? 자바스크립트의 함수란? 안녕하세요! 오늘은 자바스크립트에서 함수가 무엇인지 정말 쉽게 설명해 드릴게요. 함수는 특정한 일을 대신 해주는 작은 도구라고 생각하면 돼요. 자, 이제 차근차근 알아볼까요?1. 함수란 무엇인가요?함수는 특별한 일을 미리 정해놓고 우리가 부르면 그 일을 대신 해주는 작은 로봇 같은 거예요! 필요한 일을 함수를 통해 쉽게 할 수 있죠.2. 함수를 어떻게 만들 수 있나요?자바스크립트에서 함수를 만들려면, 먼저 이름을 정해주고 그 함수가 무슨 일을 할지 적어야 해요.function sayHello() { console.log("안녕!"); } 위 코드에서는 sayHello라는 함수를 만들었어요. 이 함수는 "안녕!"이라고 인사하는 일을 할 거예요.3. 함수를 어떻게 사용할까요?만든 함.. 2024. 10. 28.
5화. 자바스크립트 연산자 완벽정리! 자바스크립트 연산자 쉽게 알아보기!안녕하세요! 오늘은 자바스크립트에서 자주 사용하는 연산자들을 쉽게 설명해드릴게요. 자바스크립트에서 연산자는 숫자를 계산하거나, 값을 비교하거나, 조건을 확인할 때 사용하는 중요한 도구예요. 하나씩 알아볼까요?1. 더하기 연산자 (+)더하기 연산자는 두 숫자를 더하는 연산자예요. 예를 들어, 사과 2개와 3개를 더하면 총 5개가 되겠죠?5 + 3; // 결과: 82. 빼기 연산자 (-)빼기 연산자는 두 숫자를 빼는 연산자예요. 10에서 4를 빼면 6이 남아요.10 - 4; // 결과: 63. 곱하기 연산자 (*)곱하기 연산자는 두 숫자를 곱하는 연산자예요. 예를 들어, 4와 2를 곱하면 8이 돼요.4 * 2; // 결과: 84. 나머지 연산자 (%)나머지 연산자는 나눗셈의.. 2024. 10. 28.
4화. 자바스크립트의 데이터 타입 자바스크립트에서 Number, String, Boolean, null, undefined, object, Symbol은 모두 데이터 타입이에요. 각 데이터 타입은 어떤 종류의 정보를 저장하는지 알려주는 역할을 해요. 이제 하나씩 쉽게 설명해 볼게요!1. Number (숫자)Number는 숫자를 저장하는 상자라고 생각하면 돼요. 예를 들어 나이, 가격 같은 숫자를 저장할 때 사용해요.let age = 10; // 나이는 10살 let price = 5.99; // 가격은 5.992. String (문자열)String은 글자를 저장해요. 이름, 인사말 같은 글자를 저장할 때 사용하는 상자예요. 글자는 따옴표로 감싸서 저장해요.let name = "Charlie"; // 이름은 Charlielet greeti.. 2024. 10. 28.
3화. 자바스크립트의 상수란? 안녕하세요! 오늘은 자바스크립트에서 상수가 무엇인지 아주 쉽게 알려드릴게요상수는 변하지 않는 값을 담아두는 특별한 상자예요. 자, 그럼 하나씩 알아볼까요?1. 상수란 무엇인가요?상수는 한 번 정해지면 절대 변하지 않는 값을 저장하는 상자예요. 우리가 소중한 보물을 안전하게 보관하는 것처럼, 상수는 값을 바꿀 수 없도록 고정해 둡니다.2. 상수는 어떻게 만들 수 있나요?상수를 만들 때는 const라는 단어를 사용해요. 상수의 이름을 정하고 값을 넣으면 그 값은 절대 변하지 않아요!const pi = 3.14;​여기서는 pi라는 상자에 3.14라는 값을 넣었어요. 이제 pi의 값은 바꿀 수 없답니다!3. 상수를 왜 사용하나요?상수는 변하지 않는 중요한 값을 저장할 때 사용해요. 예를 들어, 원주율 3.14처.. 2024. 10. 28.
2화. 자바스크립트의 변수란? 안녕하세요! 오늘은 자바스크립트의 변수가 무엇인지 쉽게 설명해드릴게요. 변수를 알면, 자바스크립트를 더 잘 이해할 수 있답니다. 자, 그럼 변수에 대해 하나씩 알아볼까요?1. 변수가 무엇인가요?변수는 정보를 담아두는 상자라고 생각하면 돼요! 우리가 게임을 할 때 점수를 기록하는 것처럼, 자바스크립트에서도 숫자, 글자, 결과 등을 기록하는 상자(변수)가 필요해요.2. 변수를 어떻게 만들 수 있나요?변수를 만들려면 let이라는 단어를 써요. 그런 다음 변수의 이름을 지어주고, 그 상자에 넣고 싶은 값을 넣으면 돼요.let myScore = 100; 이 코드는 myScore라는 이름의 상자에 100이라는 값을 넣은 거예요!3. 변수를 왜 사용하나요?변수를 사용하면 필요한 정보나 데이터를 저장해 두고, 나중에 .. 2024. 10. 28.
반응형