상속기능 구현 할 수 있는 방법이 몇가지 더 있는데 이번엔 Object.create()로 구현해보자. 다른방법 으로 상속기능을 구현 할 수 있는 방법을 포스팅 해놨으니 참고하면 도움이 될 것이다. -prototype 2023.02.28 - [Front end/JavaScript] - 🔖 객체지향2. prototype 🔖 객체지향2. prototype function Student(이름) { this.name = 이름; this.age = 15; this.sayHi = function() { console.log('안녕하세요 ' + this.name + '입니다.') } } let 학생1 = new Student('강동욱'); let 학생2 = new Student('손흥민'); // ▲ Student가 ..
1. prototype은 constructor 함수에만 생성된다. 위 사진처럼 우리가 일반적으로 만드는 array나 object에는 prototype이 없다. 그럼 일반 object 같은걸 상속하고 싶으면 어떻게 하는가?? - constructor 함수를 만들기 - Object.create() 사용 - class 사용 2. 내 부모 유전자를 찾고 싶다면 __proto__를 출력해보면 된다. 부모로부터 생성된 자식 object들은 __proto__라는 속성이 있다. 이걸 출력해보면 부모의 prototype이 출력된다. 그래서 __proto__는 부모의 prototype과 같은 의미이다. function Student(){ this.name = '강동욱'; this.age = 15; } var 학생1 = n..
function Student(이름) { this.name = 이름; this.age = 15; this.sayHi = function() { console.log('안녕하세요 ' + this.name + '입니다.') } } let 학생1 = new Student('강동욱'); let 학생2 = new Student('손흥민'); // ▲ Student가 가지고 있는 name, age, sayHi 속성들을 물려받음 // ▲ 이러한 과정을 전문용어로 상속이라고한다. ▲ 위 코드는 객체지향 용어로 상속(inheritance)이라고 한다. Student라는 constructor가 가진 name, age, sayHi 속성들을 그대로 물려받아서 오브젝트를 하나 뽑아주는걸 상속이라고 부른다. 그래서 상속해주는 것..
🌈 constructor 문법의 용도 - object를 마구 복사(Deep copy)하고 싶을때 사용해라. - 비슷한 object 여러개 만들 때 유용하다. 비슷한 학생 object를 여러개 만들려면? - constructor 라는 object 생성 기계를 만들어라. function Student (이름) { this.name = 이름; // this는 새로생성되는 object를 뜻함(instance) this.age = 17; this.sayHi = function() { console.log('안녕하세요 ' + this.name + '입니다'); } } // ▲ 위 코드 전체를 constructor라고 함 var 학생1 = new Student('강동욱'); // ▲ Student가 가지고 있는 na..
remove라는 메서드를 만들었다. 배열 요소에서 지우고싶은 숫자를 인수로 넣으면 제거된 배열이 출력되는 메서드이다. 문제발생 : [1,3,3,3,5] 와 같이 연속된 숫자가 잘 제거가 안되는 버그가 발생했다. 하나하나 디버깅 해본결과 splice를 하면 배열 요소가 지워지면서 다음 조건에 만족하는 num의 인덱스까지 같이 바껴서 그런것이었다! 해결방법 : index라는 변수를 선언해 업데이트 되는 배열의 인덱스를 다시 재할당해주는 방식으로 해결했다. Array.prototype.remove = function (num) { for(let i = 0; i < this.length; i++) { let index = this.indexOf(num); if(this[index] === num) { this...
1. Primitive data type 그냥 문자와 숫자는 : 변수에 값이 그대로 저장됨 Primitive data type 다루기 : 복사 var 이름1 = '강동욱'; var 이름2 = 이름1; 이름1 = '손흥민'; console.log(이름1) // 손흥민 console.log(이름2) // 강동욱 2. Reference data type Array, Object는 : 변수에 reference가 저장됨 reference에는 메모리주소(화살표)가 들어있다. Reference data type 다루기 : 복사 var 이름1 = { name: '강동욱' }; var 이름2 = 이름1; 이름1.name = '손흥민'; console.log(이름1) // 손흥민 console.log(이름2) // 손흥민..
argumnets의 단점 - 쓰고싶지 않은 인수를 다 받아옴. function 함수 (a, b, c) { for(var i = 0; i < arguments.length; i++) { console.log(arguments[i]); } } 함수('쓰고싶지않은인수', 2, 3, 4); // ▼ 출력 // '쓰고싶지않은인수' // 2 // 3 // 4 Rest 파라미터 - 자리에 오는 모든 파라미터를 [ ]에 보관해줌 function 함수2 (a, b, ...rest) { console.log(rest); } 함수2(1,2,3,4,5,6,7); // ▼ 출력 // [3, 4, 5, 6, 7] arguments와 rest 파라미터의 차이점 arguments: 모든 인수를 [ ]에 담아준다. rest 파라미터:..
함수의 default 파라미터 // b자리에 아무것도 안넣을 경우 10을 넣어주세요~ function add( a, b = 10 ) { console.log( a + b ); } add(1) // 11 add(1, 2); // 3 default 파라미터는 b자리에 인수를 안넣었을 때만 발동 default 파라미터에는 수학 연산자, 다른 파라미터와 연산, 심지어 함수입력도 올 수있음 연습문제 1. function 함수(a = 5, b = a * 2 ){ console.log(a + b); return 10 } 함수(3); // ▼ 출력 // 9 연습문제 2. function 함수(a = 5, b = a * 2 ){ console.log(a + b); } 함수(undefined, undefined); // ..
…spread operator 뭔가 내용물을 빼고 싶을 때 쓰면 된다. 1. Array에 붙이면 대괄호를 제거해준다. var arr = ['hello', 'world']; console.log(...arr); // hello world 2. 문자열에 붙이면 펼쳐준다. var str = 'hello'; console.log(...str); // h e l l o ...spread operaotr 어디다가 쓰면 좋을까? 1. 배열 합치기 / 얕은 복사 var a = [1, 2, 3]; var b = [4, 5]; var c = [...a]; console.log(c) // [1, 2, 3] var d = [...a, ...b]; console.log(d) // [1, 2, 3, 4, 5] 얕은 복사 할 때 ..
빈 값 사용하기 여기서는 undefined와 null 자료형을 알아본다. 이 둘은 빈 값(비어 있음을 의미)을 표현한다는 공통점이 있지만, 차이점도 있다. undefined 컴퓨터는 대부분 우리가 입력을하면 어떤 값을 돌려준다. console.log(‘Hello, world!’) 를 쳤을때 undefined를 돌려준다. 돌려주는게 없다라 하지말고 undefined를 돌려준다라고 기억하자! 돌려줄게 없으면 undefind를 돌려준다!! typeof undefined; // "undefined" ▲ undefined는 자료형인걸 알 수 있다. !!undefined; // false ▲undefined는 불 값으로 형 변환하면 false가 나온다. ✅ 단, undefined와 false는 같지 않다. 거짓인 ..
