잼굴 코딩공장

콜라자판기 기능 요약 1. 소지금한도내에서 돈을 자판기에 입금한다. 2. 콜라를 선택하고 입금된 금액한도 내에서 획득한다. 3. 거스름돈을 반환한다. 1. 자판기에 돈 입금하기 만드는 과정에서 있었던 실수 입금버튼 기능을 잘못 이해함 입금액에 음수를 쓰면 소지금이 그만큼 늘어나는 현상 1) 입금버튼 기능을 잘못 이해함 소지금이 0원인상태에서 돈을 입금하면 소지금이 생기는, 소지금을 입금하는 버튼으로 오해함! ➜ HTML에서 소지금을 20000으로 입력해둠. 나중에 숫자만 빼기쉽도록 분리해둠 소지금 : 20000 원 2) 입금액에 음수를 쓰면 소지금이 그만큼 늘어나는 현상 소지금에서 입금액을 빼는 수식에서 생긴 버그, 값이 0보다 작은경우 튕기게했지만 음수x음수는 양수라서 뚫어버림.. result = pa..

let 사람 = { name: "Park", age: 30, nextAge() { return this.age + 1; }, }; 사람.nextAge; 함수를 만들어서 object 데이터를 다루는 이유 1. object 자료가 복잡할 때 굿 2. object 자료 수정해야 할 때 , 함수를 만들어두면 편함 let 사람 = { name: "Park", age: 30, nextAge() { return this.age + 1; }, setAge(나이) { this.age = 나이; }, }; 사람.age = '20'; // 그냥 이렇게 만들면 쉬운데 왜 굳이 setAge() 만듬? this.age = parseInt(나이); ==> 이렇게 데이터 수정시 미리 검사 가능해서 , 안전장치 (숫자 넣어야하는데 문..

extends : 유사한 class를 하나 더만들고 싶을때! -> class 상속 class 할아버지 { constructor(name) { this.성 = "Kim"; this.이름 = name; } } let 할아버지1 = new 할아버지("냐옹이"); 그냥 class로 만들면 이런형식임 extends를 써보자 ! 하는김에 내용도 추가해보자 class 할아버지 { constructor(name) { this.성 = "Kim"; this.이름 = name; } } class 아버지 extends 할아버지 { constructor() { this.나이 = 50; } } let 아버지1 = new 아버지(); 이렇게 하면 되겠찌? extends에는 this를 사용할수없다!! 내용을 추가하고 싶을땐 supe..

1. Object.create let 부모 = {name:"kim", age:50}; let 자식 = Object.create(부모); //

prototype : 상속을 구현할수있는 문법 / 유전자 느낌 / JS에만 있는 개념 function Student(이름) { this.name = 이름; this.age = 15; this.sayHi = function () { console.log("안녕하세요" + this.name + "입니다"); }; } let 학생1 = new Student("Park"); let 학생2 = new Student("Lee"); let 학생3 = new Student(); constructor를 만들면 prototype이라는 공간이 자동적으로 생긴다. prototype은 유전자이기때문에 prototype에 값을 추가하면 모든 자식들이 물려받을수 있다. Student.prototype.gender = "남"; 위 ..

constructor 사용처 : object를 막 복사하고 싶을때 사용함 출석부 만드는걸로 예시 들어봄 let 학생1 = {name : 'kim', age : 15 } let 학생2 = {name : 'kim2', age : 15} let 학생3 = {name : 'kim3', age : 15} 학생정보를 object로 만드려는데 이렇게 하나하나 만들기 너무 귀찮음 그럴때 constructor 씀 function Student() { this.name = "Kim"; this.age = 15; } 이게 constructor임. 이거 쓰면 object 무한 생성가능 function쓸때 거의 보통 함수명을 대문자로써줌 (국룰) constructor 안에서 this는 새로 생성되는 object를 뜻함 this..

ES6에서 새로생긴 화살표 함수 let fx = function() { } let fx = () => { } 함수를 만들어내는 이유: 1. 코드들을 기능으로 묶고싶을때 2. 입출력 기계를 만들고 싶을때 Arrow function의 장점 1. 입출력 기계 만들때 보기쉬움 2. 소괄호 생략가능 (파라미터가 1개일때만) 3. 코드 한줄이면 중괄호도 생략가능 => 직관적 사용 예제 [1, 2, 3, 4].foreach(function (a) { console.log(a); //a는 array내의 자료들 }); [1, 2, 3, 4].foreach((a) => console.log(a)); //a는 array내의 자료들 한줄로 간지나게 정리 가능 Arrow function 특징: 바깥에 있던 this값을 내부에서..

console.log(this); 찍으면 콘솔창에 window 머시기 뜸 function 함수(){ console.log(this) } 함수(); 이것도 마찬가지로 window 머시기 뜸 window 머시기 ==> 그냥 자바스크립트를 통째로 감싸는 녀석이라고 생각하면 됨 let object1 = { data : 'Kim', lion : function(){ console.log('front') } } 오브젝트 내에 함수 사용가능 오브젝트 내에 함수를 method라고 함 object1.lion(); //함수는 () 해줘야 출력됨 -> 콘솔에 front가 찍힌다 let object1 = { data : 'Kim', lion : function(){ console.log(this) } } object1.lio..

내부 슬롯, 내부 메서드 = JS엔진에서 사용하는 의사 프로퍼티와 의사 메서드 (Doctor 아님ㅋㅋ) 내부슬롯과 내부 메서드는 직접적으로 접근하거나 호출할수 없음. [[Prototype ]] 내부슬롯의 경우 __proto__를 통해 간접적으로 접근가능. JS엔진은 프로퍼티를 생성할때 프로퍼티 상태를 나타내는 프로퍼티 어트리뷰트를 기본값으로 자동정의함. 프로퍼티상태란 프로퍼티 값 값의 갱신 가능 여부 열거 가능 여부 재정의 가능 여부 Object.getOwnPropertyDescriptor 메서드를 사용해 간접적으로 확인가능 console.log(Object.getOwnPropertyDescriptor()); -> 프로퍼티 디스크립터 객체들을 반환한다. 프로퍼티의 종류 데이터 프로퍼티 접근자 프로퍼티 데..

var 키워드의 문제점 1. 변수 중복선언으로 의도치않은 부작용 2. var키워드로 선언한 변수는 함수의 코드블록만 지역스코프로 인정 3. 변수 호이스팅으로 의도치않게 undefined를 반환하는 경우 let키워드 ! 특징 1. 변수 중복 선언 금지 2. let 키워드로 선언한 변수는 모든 코드블록을 지역스코프로 인정하는 블록레벨스코프! 변수 호이스팅 console.log(foo); // ReferenceError let foo; -> 호이스팅이 안돼서 참조에러가 발생함. var는 선언단계와 초기화단계가 한번에 진행돼서 undefined로 초기화해주는데 let은 선언단계랑 초기화단계가 분리되어서 진행됨 ' 그 분리되는 구간을 일시적 사각지대 라고 부름 -> let 키워드는 변수호이스팅을 하지않는다?? N..