[JS.개발일지] 8. 자바스크립트 5(상속) 상속객체들간에 관계를 구축하는 방법 부모클래스는 User이고 자식은 Student, Teacher 이다. 자식은 상속받을때 extends라고 손을 뻗어야 부모로부터 상속받을 수 있다. 부모를 호출할때 super를 사용한다. 생성자뿐만 아니라 함수를 호출 할수도 있다. 객체를 생성하는 방법 3가지불변객체 (immutable Object ) 정의하기1) preventExtension : 객체가 추가되는것을 막는다. (수정하고 삭제는 가능)2) seal : 객체의 구조가 봉인된다. (수정만 가능)3) freezed : 객체를 완전 얼려버려 아무것도 할 수 없도록 한다. :: 참고로 해당 명령어를 실행하면 다시 원래대로 되돌릴수는 없다. 객체를 복사해서 수정해야함. 2025. 1. 11. [JS.개발일지] 7. 자바스크립트 4(class) 이제 클래스를 공부해보자. getter와 setter. 외부에서 내부필드에 직접 접근하지 못하도록 하고 오직 getter와 setter를 통해서만 데이터에 접근하고 수정할 수 있도록 한다. (보안성을 높일 수 있다는 장점이 있음)이것을 통해 '유효성검사, 로그기록, 변경이력추적' 등의 다양한 로직을 구현 할 수 있다고 하는데일단 기본적인것들만 우선 테스트 해보자. 위 코드에서 몸무게는 출력되지 않는다. #을써서 private속성을 줬기 때문인데 get을 써야만 해당 속성값을 가져올 수 있다! static 메서드클래스 인스턴스에 의존하지 않고클래스 이름을 통해 직접적으로 호출이 가능하다. static 메서드를 사용하는 이유1. 객체 생성의 유연성 - 동일한 클래스라도 다양한 입력방식으로 객체 생성 가.. 2025. 1. 4. [JS.개발일지] 6. 자바스크립트 3-2(배열메서드) 배열 메서드1. map() : 배열의 각 요소에 (괄호)안에 있는 함수를 실행시켜서 새 배열로 반환. 이렇게 {return num * 2} 리턴문을 써도 되지만 수식이 단순할때는 생략해서 num * 2로 표현한다. 내가 지정한 값만 변경해서 반환하기도 가능 이렇게 ...(스프레드연산자)를 이용해 기존 객체를 수정하지않고 새로운 객체 2배수로 반환한다.({...item, 속성: 새로운 값}) 2. filter() : 조건을 만족한 요소들만 새 배열로 반환 다음은 소수를 필터링하는 재미있는 예제다. (소수, 자신과 1외에는 나누어 떨어지지 않는 수) 소수를 구하는 함수를 필터메서드 안에 대입시키면 소수를 구할 수 있다! 3. reduce() : 배열의 모든 요소를 하나로 줄인다는 뜻.배열을 순회하며, .. 2024. 12. 30. [JS.개발일지] 5. 자바스크립트 3-1(변수와객체) 변수와 객체의 차이!Primitive 의 값이 변경되는것과 Object의 주소가 변경되는것의 차이. 변수(스트링, 넘버,불리언,널, 언디파인, 심볼)에 값이 변경되는것은 메모리의 값이 직접 변경되는것이고객체 {객체, 배열, 함수} 에 key:valul가 변경되는것은 주소가 변경되는것이기 때문에 관련된 객체들은 모두 그 주소를 참고하게 된다. 항목Primitive 값Object 값저장위치스택(Stack)힙(Heap)에 객체, 스택에 참조값.저장내용값 자체를 저장 참조값 (메모리주소)저장크기고정크기가변크기속도빠른편느린편독립성값 복사시 독립적참조값 복사시 동일 객체 참조 사칙연산중에 %(나머지)를 활용하는 다양한 예시! 1) 홀짝 만들기 2) 배열 순환시키기 3) 순환을 이용해서 특정 n 번째만 실행시.. 2024. 12. 25. [JS.개발일지] 4. 자바스크립트 2(객체와 콜백) 객체의 비구조화 할당매개변수를 할당하는 재미있는 방법.{} 를 활용하면 객체의 특정 키값을 찾아서 할당해준다. name, age, hobby 등 변수를 선언 할때도 비구조화 할당을 사용할 수 있다. 바로 실행되는 함수 (constructor 안에서 함수 실행) 와내가 호출 시키는 함수를 비교해봤다. 1. 바로 호출하기2. 특정시점에 호출하기전원켜주면 poweron 하고행동하게 하면 집을 청소하는 로봇 ---------------- 1초당 1번씩 짖는 강아지를 코딩하는데 실수를 했다!. 둘다 5초동안 1초에 1번씩 짖으라고 했지만 첫번째 강아지는 4번만 짖었다! 오마이갓! 첫번째 강아지. 5번째 짖는 동시에 클리어되버리는 이슈 ㅠㅠ. 물론 5001 이라는 숫자를 쓰면 되겠지만다른 방법으로 5번 짖.. 2024. 12. 20. [JS.개발일지] 3. 자바스크립트 1(복습) 유데미 강좌를 듣다가 기본에 충실해야겠다는 생각이 들었다. 옛날 생각하면서 자바스크립트 복습! 객체와 배열 배열을 돌리는 방법 (for문과 화살표함수) 콜백함수 실행하기 (함수안에 함수를 실행하기) (화살표함수의 this 사용 사례1) 3초짜리 타이머 만들기 (화살표함수의 this 사용사례2) 1초후에 내이름(heesangs) 부르기 3초 후에 내 이름 부르기. 2024. 12. 18. [RN.개발일지] GUIDE 문서 이해 무엇부터 시작해야될까 고민하다가 01. GUIDE 문서부터 이해해보기로 했다. (이밖에도 2.컴포넌트, 3.API, 4.아키텍쳐 문서가 추가적으로 있다.) https://reactnative.dev/docs/0.74/getting-started Introduction · React NativeThis helpful guide lays out the prerequisites for learning React Native, using these docs, and setting up your environment.reactnative.dev GUIDE총 15개의 큰 대제목이 있는데 해당 내용은 다음과 같다. 기초 및 설정 1. The Basics - 기본React Native의 기초 개념과 기본 컴포넌트들에.. 2024. 11. 12. [RN.개발일지] 환경설정과 초기세팅 RN 환경 설정과 초기 세팅기본설치 1. Homebrew 설치Mac에서 필요한 패키지를 쉽게 설치하도록 도와주는 툴/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 2. Node.js와 npm 설치리액트는 Node 기반. Node.js를 설치하면 npm 자동 설치. 이것을 통해 리액트네이티브 CLI설치 혹은 라이브러리 설치 가능.brew install node 3. JDK 설치 (Android 개발을 위한 필수 설정)안드로이드 프로젝트의 컴파일과 관련된 여러 작업에 사용brew install --cask adoptopenjdk 4. React Native CLI 설치프로젝트를 쉽게 생.. 2024. 11. 10. 웹팩 :: webpack webpack 이란 webpack은 무엇일까? 서로 연관관계가 있는 웹 자원들을 js, css, img 같은 정적인 자원으로 변환해주는 모듈 번들러. 웹페이지에서 잘 돌아가도록 최적화 시켜주고 성능을 올려줌. 번들링이란 C언어가 컴파일 하는것과 비슷하게 필요한 부분들을 묶어주는 역활을 하는것이라 볼 수 있다. 즉 파일을 분류하고 정리하고 실행하는 기준을 만들어주는것이 webpack 이다. webpack없이 글로벌 환경으로 개발시 문제점. html에서 글로벌 환경으로 를 로딩 (asp, jsp 같은 서버사이드 랜더링 방식)하는 서버사이드 랜더링의 문제점을 해결. 예) jquery $변수는 다른 라이브러리에도 사용됨으로 충돌가능 로딩순서에 의존성. 예) jquery를 먼저로딩하고 jquery-ui를 로딩해야.. 2020. 10. 27. 이전 1 2 3 다음
