본문 바로가기

코딩일기/React-Native15

[React 기초] Props란 Props Props는 수정 수정 변경이 불가한 읽기전용이다. props는 부모 자식 관계가 형성되어야 의미가 있다. 왜냐면 부모 -> 자식으로 data가 전해지기 때문이다. 그래서 일방통행이다. 부모 컴포넌트로 전달받은 prop는 수정변경이 되지 않고 그대로 쓰이게 된다. 이걸 쓰는 이유는 부모하나만 만들면 자식들은 부모로부터 받기만 하면 되니 코드의 중복성을 제거할수 있다. 자 그럼 Props가 실제로 어떤역할을 하는지 알아보자. 일단 부모의 소스부터 보자. 부모소스 import PropsChild from './propsChild' class App extends Component{ state = { sampleText : 'Hello World', sampleBoolean : false, samp.. 2021. 5. 12.
[React 기초] State 란? State state는 값을 변수에 할당해서 값을 넣는 방식을 관리하는 것이다. 소스를 통해 한번 확인해보자 ex) class App extends Component{ state = { sampleText : 'Hello World' } render(){ return( {this.state.sampleText} ) } } 위처럼 state라는 state에 sampleText라는 변수를 만들면 render()안에서 {this.state.sampleText} 를 통해서 해당 변수를 호출이 가능하다. 위에서 state는 state 변수명이므로 내가 아무렇게나 설정이 가능하다 sta = {} 이렇게도 설정이 가능한것이다. 다만 사용할때는 변수명에 맞게 this뒤에 붙여야 된다. (state안에 있는 변수명 내가.. 2021. 5. 12.
[ES6 기초] 상속 상속도 자바와 거의유사하다. 소스를 통해서 보자. class Person { constructor(name,gender){ this.name = name; this.gender = gender; } greetings(val = '안녕'){ console.log(val); } } let wook = new Person('이욱재','남자'); console.log(wook); wook.greetings(); class Korean extends Person { constructor(name,gender, eyeColor, hairColor){ super(name,gender); this.eyeColor = eyeColor; this.hairColor = hairColor; } greetings(val = '.. 2021. 5. 11.
[ES6 기초] class 설명 class 클래스는 자바의 클래스와 거의 유사하다. 하지만 다른점이 있다면 자바는 안에 멤버변수를 따로 만들어 줬어야 했지만 자바스크립트는 따로 만들어 주지 않고 생성자만 만들어도 된다. ex) class Person { constructor(name,gender){ this.name = name; this.gender = gender; } greetings(val = '안녕'){ console.log(val); } } let wook = new Person('이욱재','남자'); console.log(wook); wook.greetings(); 결과 Person {name: '이욱재', gender: '남자'} 안녕 이처럼 멤버변수를 만들지 않아도 this.멤버변수 를 써서 멤버변수안에 집어넣는거 같다. 2021. 5. 11.