목록Frontend/JS & React (33)
elevne's Study Note
Java나 C++에서는 여러 스레드로 동시 프로그래밍을 구현할 수 있다. 이러한 프로그래밍을 구현할 때에는 데이터를 보호하는데 더욱 주의해야 한다. 여러 개의 스레드가 값을 동시에 갱신하면 데이터의 무결성(완전한 수명주기를 거치며 데이터의 정확성과 일관성을 유지하고 보증하는 것)이 훼손될 수 있기 때문이다. 하지만 Javascript 프로그램은 하나의 스레드에서 실행이 된다. 한 함수가 시작되면 프로그램의 다른 부분은 기존 함수가 실행을 끝낼 때까지 기다려야 하는 것이다. 이러한 단일 스레드를 사용하면, 프로그램에서 어떤 동작이 끝나기를 오래 기다려야 한다면(ajax 등과 같은 방식으로 데이터를 가져오는 것이 그 예) 그 동안 다른 작업을 할 수 없는 것이다. 이 때문에 Javascript에서 시간이 걸..

JS에서 배열을 생성할 때 길이를 지정해줄 수도 있지만, 빈 Array로 만들고 .length로 길이를 지정해줄 수도 있다. const emptyArray = [] emptyArray.length = 1000000 console.log(emptyArray) 또, 이전에 많이 사용하였던 Destructuring 문법을 사용하여 Array를 병합하는 것도 가능하다. let array1 = [1, 2, 3] let array2 = [4, 5, 6] let tmpArray = [...array1, ...array2] console.log(tmpArray) JS에서 자주 사용되는 객체를 Array로 만들 때는, Array.from 메서드를 사용해주면 된다. 이 때, 객체 내부에 length 값이 아래와 같이 지정..

JS에서 문자열을 다루는 다양한 방법에 대해 알아보았다. 문자열 또한 Array와 같이 Destructuring 문법을 사용하여 Character 단위로 쪼개서 Array에 넣을 수 있다. let text = "HELLLO!" let characters = [...text] console.log(characters) 문자열에서 특정 문자열, 또는 Character의 index를 아래와 같은 방식으로 알아볼 수 있다. indexOf는 첫 번째, lastIndexOf는 마지막 Matching index를 반환한다. let index = text.indexOf("EL") console.log(index) index = text.lastIndexOf("L") console.log(index) 그 외에도 star..

이번에는 Javascript에서 숫자와 날짜 형식의 데이터를 다루는 법에 대해 알아보았다. 소수점 아래 자리수의 숫자를 가진 Number 데이터들에는 아래와 같은 메서드를 사용할 수 있다. const x = 1 / 600 console.log(x) console.log(x.toFixed(4)) console.log(x.toExponential(4)) console.log(x.toPrecision(4)) toFixed: 고정된 형식의 부동소수점 숫자를 소수점 아래 몇 자리까지 남겨둘지 지정 toExponential: 한 자리 정수와 소수점 아래 n-1 개의 숫자를 지수형식으로 표시 toPrecision: 유효숫자 표시 이 외에도 아래와 같은 메서드를 Number 데이터에 대해 사용할 수 있다. // isN..

아래 코드와 같이 JS 객체를 생성해줄 수 있다. worker = { name : "Steph Curry", salary : 10000000, raiseSalary(percent){ this.salary *= (1+percent)/100 } } 위에서 raiseSalary는 worker 객체에 선언된 함수로, 본문에서 this.salary를 참조한다는 점을 제외하면 일반 함수와 같다. this 참조는 function이나 function을 생략한 단축 문법에서만 동작하고 화살표 함수에서는 동작하지 않는다고 한다. 또 위와 같은 객체를 여러개 만들 때, 각각의 worker 객체에 raiseSalary 프로퍼티를 만들어줘야 한다. 이 때 각 worker 객체가 한 함수를 공유할 수 있도록 Prototype(프..

자바스크립트에서 함수는 값을 취급하며 이를 변수에 저장하거나, 인수로 전달하거나, 다른 함수의 결과로 반환할 수 있다. 아래 코드처럼 사용할 수 있는 것이다. let numbers = [1, 2, 3, 4, 5] f = Math.sqrt let result = numbers.map(f) console.log(result) 위의 map 함수처럼 다른 함수를 소비하는 메서드를 고차함수라고 한다. 화살표 함수를 사용할 때, 매개변수가 한 개라면 아래 코드와 같이 괄호를 생략할 수 있다고 한다. let numbers = [1, 2, 3, 4, 5] let result = numbers.map(x => Math.sqrt(x)) console.log(result) 이전 시간에 봤던 for of, for in 루프 ..

Javascript에서는 || 메서드를 NVL 함수처럼 사용할 수 있다. 아래와 같이 코드를 작성할 수 있는 것이다. let result = undefined || "TEST"; console.log(result) 하지만 위 방법은 메서드가 0, 빈 문자열, false를 반환해도 작동하게 된다. 어떠한 대상이 undefined 혹은 null 이 아닐 때만 값을 사용할 수 있는 편리한 수단이 필요하다. 아래와 같이 x ?? y 형식의 코드를 사용하면 된다! let result = "" ?? "TEST" console.log(result) 또, 비슷하게 사용할 수 있는 것으로 x?.프로퍼티명 형식이 있다. 이는 x가 undefined, null 이 아니면 프로퍼티를 반환하고 그렇지 않으면 undefined를..

React, React Native를 공부할 계획을 세웠는데 이에 앞서 우선 Javascript를 복습해야겠다는 생각을 했다. 기초부터 다시 천천히! Javascript에서 우선 var은 쓰지 않는다!!! (이후 로직에서 문제가 생길 가능성이 커짐.) Java에서 Integer.parseInt, String.valueOf 등으로 형변환을 해준 것을 Javascript에서는 아래와 같은 코드로 처리해줄 수 있다. const a = parseFloat("3.14") const b = parseInt("3") console.log(typeof a) console.log(typeof b) const a2 = a.toString() const b2 = b.toString() console.log(typeof a2..