웹/JavaScript
-
[Javascript] 생성자 함수, 프로토타입, prototype웹/JavaScript 2023. 1. 11. 11:43
💡 생성자 함수의 필요성 // 얄코치킨의 체인점을 나타내는 객체들 const chain1 = { name: '판교', no: 3, introduce () { return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } }; const chain2 = { name: '강남', no: 17, introduce () { return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } }; const chain3 = { name: '제주', no: 24, introduce () { return `안녕하세요, ${this.no}호 ${this.name}점입니다!`; } }; // 이처럼 같은 형식의 객체들을 다수 만들어야 한다면? I. 생성자 함수로..
-
[Javascript] 객체,프로퍼티 접근, 메소드, 식별자, delete웹/JavaScript 2023. 1. 11. 10:59
I. 객체 생성과 프로퍼티 접근 const food1 = { name: '햄버거', price: 5000, vegan: false }; console.log(food1); console.log( food1.name, // 💡 마침표 프로퍼티 접근 연산자 food1['price'] // 💡 대괄호 프로퍼티 접근 연산자 ); // 빈 객체 생성 const food2 = {}; console.log(food2); // 프로터피 추가 food2.name = '샐러드'; food2.price = '6000'; food2['vegan'] = true; console.log(food2); // 프로터피 수정 food2['price'] = '6500'; food2.vegan = false; console.l..
-
[Javascript] 매개변수 ,중첩함수, 재귀함수, factorial, 즉시실행함수,IIFE웹/JavaScript 2023. 1. 11. 06:52
💡 함수의 매개변수 갯수를 넘어가는 인수 오류를 일으키지 않고 무시됨 function add(a, b) { return a + b; } console.log( add(1, 3), add(1, 3, 5), add(1, 3, 5, 7) ); I. 기본값 매개변수 default parameter 👉 MDN 문서 보기 function add(a = 2, b = 4) { console.log(`${a} + ${b}`); return a + b; } console.log( add(), add(1), add(1, 3) ); II. arguments - 함수 내에서 사용가능한 지역 변수 👉 MDN 문서 보기 배열의 형태를 한 객체 - 배열은 아니지만 사실상 배열처럼 동작 (배열도 사실 객체지만...) 함수 호출..
-
[Javascript] 일급 객체 (할당, 인자로 전달, 결과값 반환, 커링, 함수)웹/JavaScript 2023. 1. 11. 05:31
일급 객체 First Class Object 👉 MDN 문서 보기 함수를 변수와 같이 다루는 언어에 있는 개념 자바스크립트의 함수도 일급 객체 함수는 기본적으로 객체 // ⭐️ 함수의 자료형 function addNumbers (a, b) { return a + b; } console.log(typeof addNumbers); 일급 객체의 특성 상수 또는 변수에 할당될 수 있음 다른 함수에 인자로 전달될 수 있음 다른 함수의 결과값으로서 반환될 수 있음 I. 할당 function isOddNum (number) { console.log( (number % 2 ? '홀' : '짝') + '수입니다.' ); return number % 2 ? true : false; }; const checkIfOdd ..
-
[Javascript] 함수,인수,인자,화살표함수웹/JavaScript 2023. 1. 10. 14:43
💡 기본 문법 function 함수명 (입력값) { // 수행할 일 return 반환값 // 있을 시 } 함수명(입력값); I. 함수를 사용한다는 것 1. 반복될 수 있는 작업을 정의해두는 것 // 함수 사용 전 let a = 3, b = 4; console.log(`${a} + ${b} = ${a + b}`); console.log(`${a} - ${b} = ${a - b}`); console.log(`${a} * ${b} = ${a * b}`); console.log(`${a} / ${b} = ${a / b}`); let c = 10, d = 2; console.log(`${c} + ${d} = ${c + d}`); console.log(`${c} - ${d} = ${c - d}`); ..
-
[Javascript] 블록문, 스코프, scope, if,else,switch,지역변수,전역변수,local,global웹/JavaScript 2023. 1. 10. 12:52
블록문 👉 MDN 문서 보기 0개 이상의 문statement들을 묶은 단위 일반적으로, 이후 배울 제어문, 함수 등에 사용 새로운 스코프 생성 스코프 scope 블록 안에 선언된 변수와 상수를 밖에서 사용 불가 { const x = 'Hello'; let y = 'world!'; console.log(x, y); } console.log(x); console.log(y); 블록 안쪽에서는 바깥의 것 사용 가능 let x = 1; { let y = 2; console.log(x, y); } console.log(x); console.log(y); 블록 안쪽에 변수나 상수가 새로 선언되면 바깥 것을 덮어씀 const xx = 0; let yy = 'Hello!'; console.log(xx, yy);..
-
[Javascript] 객체, 배열, 원시타입, 참조타입웹/JavaScript 2023. 1. 10. 11:54
💡 객체와 배열은 원시타입이 아닌 참조 reference 타입 앞서 다룬 자료형들은 원시 primitive 타입 둘의 차이는 다음 강에서 다룰 것 I. 객체 미리보기 자바스크립트에서 원시 타입이 아닌 모든 데이터는 근본적으로 객체 복합적인 정보를 프로퍼티 property - (키와 값의 조합)으로 저장하는 자료형 const objName = { key1: value1, key2: value2, ... }; // ⚠️ 블록이 아님! 1. 프로퍼티 접근 💡 속성값에 접근하는 두 방법 //1. 객체명.key console.log( person1.name, person1.age, person1.married ); //2 객체명[key] console.log( person1['name'], // 속성명을 stri..