본문 바로가기

전체 글

 (149)
LifeCycle API (1) lifeCycle 은 리액트의 생명주기 입니다. 크게 3가지로 나눠집니다. 1.나타날 때 2.업데이트 될 때 3. 사라질때 -Mounting 컴포넌트가 화면에 나타날 때 -Updating 컴포넌트에 prop가 바뀌거나 state가 바뀔때 -Unmount 컴포넌트가 사라질 때 constructor 리액트가 실행될떄 가장먼저 실행되는 함수 하는 일은 State의 초기 설정 또는 컴포넌트가 만들어지는 과정에서 미리 해야되는 것들을 하는 작업들을 하는 것 getDerivedStateFromProps props로 받은 값을 state에 다가 동기화 시키고 싶을 때 또 마운팅 과정에서 나 또는 렌더 과정에서 Props가 바뀔때 사용됩니다. render 함수는 어떤 돔을 만들게 될지 내부에 있는 태그들에 어떠한 값을..
참조 2 let a = 1; function func(b){ b = 2; } func(a); console.log(a) 다시 예를 들자면 a의값은 b가되니깐 b=a 라고하면 b=2 이지만 a=1 입니다. 함수 안에서 b의값을 2로 선언해도 a의 값에는 영향이 가지 않습니다. 다른 예제를 보자면 let a = {'id':1}; function func(b){ b = {'id':2}; } func(a); console.log(a.id); // 1 변수에 담겨있는 값이 객체이면 b=a 라고 선언했지만 b = {'id':2}; 이라고 새로운 객체를 만들었기 때문에 a.id는 1입니다. let a = {'id':1}; function func(b){ b.id = 2; } func(a); console.log(a); a={..
참조 전자화된 시스템의 가장 중요한 특징은 복제입니다.. 현실의 사물과 다르게 전자화된 시스템 위의 데이터를 복제 하는데는 비용이 거의 들지 않습니다. 바로 이러한 특징이 소프트웨어를 기존의 산업과 구분하는 가장 큰 특징일 것입니다. 프로그래밍에서 복제가 무엇인가를 살펴봅시다. let a = 1; let b = a; b = 2; console.log(a); // 1 결과는 1입니다. 변수 b의 값에 변수 a의 값이 복제된 것입니다. 참조는 영어로 레퍼런스라고 합니다. let a = {'id':1}; let b = a; b.id = 2; console.log(a.id); // 2 a.id값을 바꿔도 b.,id값이 바뀌고 b.id값을 바꿔도 a.id값도 바뀝니다. 이것이 참조입니다. let a = {'id':1}..
원시 데이터 타입 원시 데이터 타입(기본) VS 객체 데이터 타입(참조) 원시 데이터 타입은 숫자 ,문자,불리언(true/false),null,undefiend (primitive type)이라고 합니다. let str = 'coding'; console.log(str.length); // 6 console.log(str.charAt(0)); 이상한게 있습니다. 문자열은 원시 데이터 타입인데 srt.charAt(0)은 객체 처럼 보입니다. 정식 명칭은 Object access Operator 객체 접근 연산자입니다. srt. 여기에 점은 객체입니다. srt은 객체입니다. 좀 혼란스러울수 있습니다. 문자열을 제어하기 위해서 몇번째 자리인가 또는 몇개의 글자가 있는가 어떠한 작업을 하기 위해서는 문자열을 객체데이터로 작업을 ..
object 확장의 위험 object.prototype.contain = function(neddle) { for(var name in this){ if(this[name] === neddle){ return true; } } return false; } let o = {'name':'egoing', 'city':'seoul'} console.log(o.contain('egoing')); let a = ['egoing','leezche','grapittie']; console.log(a.contain('leezche')); 이런확장은 모든 객체의 영향을 주기 때 문에 위험합니다. a ["egoing", "leezche","graphttie"] o Object = {'name':'egoing', 'city':'seoul', con..
object 확장 어떠한 프로그래밍을 만들 때 원리를 먼저 생각하는 것보다는 어떻게 사용될건지를 어디에 사용될건지를 먼저 생각하는 것을 추천드립니다. Object.prototype.contain=function(needle){ for(let name in this) { if(this[name]=== needle){ return true; } } return false } let o = {'name':'egoing', 'city':'seoul'} console.log(o.contain('egoing')); let a = ['egoing','leezche','grapittie']; console.log(a.contain('leezche')) Object 모든 객체를 뜻하고 어떠한 메소드를 갖는다고 하면 어떠한 프로토타입이라는..
Object Object 객체는 객체의 가장 기본적인 형태를 가지고 있는 객체입니다.. 다시 말해서 아무것도 상속받지 않는 순수한 객체입니다. 자바스크립트에서는 값을 저장하는 기본적인 단위로 Object를 사용합니다. 예를 보자면 우리가 알고있는 let grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80}; 동시에 자바스크립트의 모든 객체는 Object 객체를 상속 받는데, 그런 이유로 모든 객체는 Object 객체의 프로퍼티를 가지고 있습니다. 모든 객체들이 사용할수 있는 프로 퍼티입니다. 작은 예를 들어보면 object.key라는 메소가 있습니다. 우리가 공부하는거에 중요한점은 object라는 객체는 어떤형태의 메소드가 있는지 그 메소드들은 형태에 따라 어떻게 사용하는 지 ..

티스토리툴바