추월차선

리액트 네이티브 밋업 Fabric interior layer은 fabirc을 지원하지 않아도  리액트 네이티브 0.73에서는 자동으로 이전 호환되지 않는 라이브러리들(레거시들)을 fabric 환경에서 돌릴 수 있다. Fabric module…. 라이브러리의 package.json에서 codegenconfig필드가 있는 지 확인해보면 라이브러리가 어떤 아키텍처를 지원하는지 확인이 가능하다. 일단 리액트 네이티브 업그레이드 먼저 하는게 좋을 듯 하다. 그리고 내가 사용하는 리액트 네이티브의 버전이 라이브러리와 호환이 되는 지 확인하는 것이 좋다. ——라이브러리 만들기~~ callstack이 관리하는 create-react-native-library를 이용해 매우 간편하게 turbo module, fabric..

1. 정규 표현식은 문자열을 대상으로 패턴 매칭 기능을 제공한다. 만약 정규표현식이 없다면 반복문을 통해서 한문자씩 연속해서 체크해야할 것이다. 정규 표현식은 자바스크립트의 고유의 문법이 아니라 대부분의 언어와 코드 에디터에 내장되어 있다. 2. 정규표현식 생성정규 표현식 리터럴정규 표현식 리터럴은 패턴과 플래그로 구성된다.const target = 'IS this all there is?';// 패턴: is// 플래그: i => 대소문자 구분 안하고 검색const regexp = /is/i;regexp.test(target); // trueRegexp 생성자 함수 사용const target = 'Is this all there is?';const regexp = new RegExp(/is/i);rege..

1. 배열 메서드배열 메서드 중에 간혹 원본 배열을 직접 변경하는 경우가 존재할 수 있으므로 조심하자. 예를들어 array.push(3) 이런 경우 원본 배열을 수정해버린다.Array.isArray전돨된 인수가 배열이면 true, 배열이 아니면 false를 반환한다.// falseArray.isArray();//trueArray.isArray([]);Array.prototype.indexOfconst arr = [1, 2, 3];// 배열 arr에서 요소 2를 검색하여 첫 번째로 검색된 요소의 인덱스를 반환한다.arr.indexOf(2); // 1//없으면 -1을 반환한다.arr.indexOF(4); // -1 indexOf보다 includes가 가독성이 좋으니깐 자주 사용하자.const foods = ..

1. 배열이란?배열은 여러 개의 값을 순차적으로 나열한 구조이다.const a = ['반원재', '이규리']; 배열이 가지고 있는 값을 요소(element)라고 한다. 배열의 요소는 배열에서 자신의 위치를 나타내는 0 이상의 정수인 인덱스를 가진다. 인덱스는 0부터 시작된다. a[0]; //'반원재'a[1]; //'이규리' 배열은 배열의 길이를 나타내는 length 프로퍼티를 가진다. a.length; // 2 배열은 객체 타입이다. 하지만 객체와의 결정적인 차이가 존재하는데 바로 배열은 값의 순서가 존재하고. length 프로퍼티를 사용할 수 있다는 점이다. 즉, 배열의 장점은 처음부터 순차적으로 요소에 접근이 가능하다는 장점이 있다. 2. 자바스크립트 배열은 일반적인 배열의 개념이 아니다! 우리가 알..

1. 클래스의 인스턴스 생성과정인스턴스 생성과 this 바인딩: 암묵적으로 빈 객체가 생성되고 이 빈 객체가 바로 인스턴스가 된다. 인스턴스는 this에 바인딩 된다.인스턴스 초기화: constructor 내부의 코드가 실행되어 this에 바인딩 되어 있는 인스턴스를 초기화한다.인스턴스 반환: 완성된 인스턴스가 바인딩된 this가 암묵적으로 반환된다.2. 프로퍼티인스턴스 프로퍼티: constructor 내부에서 정의해야한다. 앞에서 설명했으니 넘어간다.접근자 프로퍼티: 값이 존재하지 않고 다른 프로퍼티의 값을 읽거나 저장할 때 사용하는 접근자 함수(getter, setter)로 구성된 프로퍼티다.class Person { constructor(firstName, lastName) { this.fi..

1. 기존 ES5에서는 생성자 함수와 프로토타입을 통해 객체지향 언어의 상속을 구현이 가능했다.var person = (function() { // 생성자 함수 function Person(name) { this.name = name; } //프로토타입 메서드 Person.prototype.sayHi = function () { console.log('hihi'); } return Person;}());var me = new Person('Lee');me.sayHi(); ES6에 도입된 클래스로 새로운 객체 생성 메커니즘이 등장하였다. 2. 클래스 정의 : 기존의 방식과 거의 유사하다.// 클래스 선언문Class Person { //생성자 con..

실행 컨텍스트(1)에서 익힌 개념들을 가지고 구체적으로 예시를 통해 실행 컨텍스트가 어떻게 구현되는지 살펴보자 var x = 1;const y = 2;function foo (a) { var x = 3; const y = 4; function bar (b) { const z = 5; console.log(a + b + x + y + z); } bar(10);}foo(20); 1. 전역 객체가 생성된다. 우리가 알고 있는 window 객체가 생성된다. 이후에 나올 과정부터는 특정 실행 컨텍스트 동작 원리의 반복이다. 아래 과정을 명심하고 넘어가자.1. 실행 컨텍스트 생성2. 함수 렉시컬 환경 생성2-1. 함수 환경 레코드 생성2-2. this 바인딩2-3. ..

1. 자바스크립트에서는 소스코드를 4가지 타입으로 구분하고 소스코드의 타입에 따라 실행 컨텍스트를 생성하는 과정이 다르다. 2. 소스코드의 평가와 실행  예시로 아래 과정을 보자 var x; // 1. 소스코드의 평가과정에서 실행 컨택스트에 등록되는 정보x = 1; // 2. 소스코드의 실행과정에서 x를 실행컨택스트에서 찾아 1이라는 값을 할당한다.  3. 그래서 실행 컨텍스트가 뭔데?실행 컨텍스트: 식별자, 스코프를 렉시컬 환경으로 관리, 코드 실행 순서를 관리하는 실행 컨텍스트 스택으로 관리하는 것으로 소스코드를 실행하는 데 필요한 환경을 제공하고 관리하는 영역.   3-1. 실행 컨텍스트 스택이란코드 실행 순서를 관리한다. const x = 1;function foo() { const y = 2; ..

자바스크립트 객체는 크게 3가지로 분류된다.표준 빌트인 객체: ECMA Script 사양에 정의된 객체로 자바스크립트 실행환경과 무관하게 언제든지 전역 객체의 프로퍼티로서 사용가능.호스트 객체: ECMA script 사양에 정의되지 않지만 자바스크립트 환경(브라우저 또는 node.js 환경)에서 추가로 제공하는 객체를 말한다.사용자 정의 객체: 사용자가 직접 정의한 객체우리는 이 중에서도 표준 빌트인 객체를 살펴볼 것이다. 1. 표준 빌트인 객체Math, Reflect, Json을 제외한 표준 빌트인 객체는 모두 인스턴스를 생성할 수 있다. const numObj = new Number(123); // Number {123} 이렇게 생성된 인스턴스는 표준 빌트인 객체의 프로토타입 메서드를 사용할 수 있게..

1. strict mode는 ES5부터 도입 된 것으로 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. ES6부터 도입된 클래스와 모듈은 기본적으로 strict mode가 적용된다. 2. strict mode 왜 써야하나? 왜냐하면 자바스크립트 엔진은 암묵적으로 개발자가 원하지 않는 행위를 하는 경우가 존재함. 이런 행위를 막기 위해 명시적인 에러를 발생시킬 필요가 있다는 것이다.// 전역 객체에 x 프로퍼티를 동적으로 생성한다.function foo() { x = 10;}foo(); 3. strict mode를 사용하려면 아래처럼 전역의 선두 또는 함수 몸체의 선두에 'use strict'를..