ES2016의 새로운 기능
Array.prototype.includes() / 지수연산자
includes()는 배열에 찾고자 하는 원소가 존재한다면 true를 반환하고 아니면 false 를 반환한다. 그리고 파라메터를 두개로 늘려서 파라미터의 첫번째는 찾고자하는 수를 두번째 파라미터는 시작할 인덱스를 뜻한다.
let array = [1, 2, 3, 4, 5];
console.log(array.includes(3)); // true
console.log(array.includes(10)); //false
console.log(array.includes(2, 0)); //true
console.log(array.includes(1, 3)); //false이런식으로 간단한 예제를 통해서 includes의 역할을 볼 수 있다.
지수연산자
console.log(Math.pow(3, 2)); // 9
console.log(2 ** 3); // 8기존의 방식은 .pow()를 이용하지만 새로운 방식은 중간의 애스터리스크만 두개 이용하면 지수연산자를 계산할 수 있다.
ES2017의 새로운 기능
문자열 패딩
패딩은 앞자리나 뒷자리에 추가할수있다. 쉽게 설명하자면 일종의 띄워쓰기 같은것이다.
뒤에 추가하는건 padEnd() 앞에 추가할땐 padStart()를 사용한다.
console.log("Hello".padStart(6)); // Hello
console.log("Bye".padEnd(5)); //Bye (끝)이런식으로 사용한다.
그리고 패딩에 사용자 지정 값을 추가할 수 도 있다.
console.log("Hello".padEnd(11, " Velog")); //Hello Velog
console.log("1".padStart(3, 0)); // 001
console.log("77".padStart(3, 0)); // 077이런식으로 파라메터의 값을 추가하면 앞이나 뒤에 값을 추가 할 수 있다.
Object.entries() / Object.values()
const car = {
company: "Porsche",
type: "992.1",
year: "2022",
};
console.log(Object.entries(car)); // [ [ 'company', 'Porsche' ], [ 'type', '992.1' ], [ 'year', '2022' ] ]
console.log(Object.values(car)); // [ 'Porsche', '992.1', '2022' ]간단한 예제를 보면서 무슨코드인지 보자 두 메서드는 객체에 접근하는 메서드이다.
예제에서 볼 수 있듯이 entries는 모든 값을 반환하고
value는 키값을 제외한 value값만 보여주는것을 볼 수 있다.
Object.getOwnPropertyDescriptors()
const car = {
company: "Porsche",
type: "992.1",
year: "2022",
};
console.log(Object.getOwnPropertyDescriptors(car));실행결과
{
company: {
value: 'Porsche',
writable: true,
enumerable: true,
configurable: true
},
type: {
value: '992.1',
writable: true,
enumerable: true,
configurable: true
},
year: {
value: '2022',
writable: true,
enumerable: true,
configurable: true
}
}
실행결과만 봐도 무슨일을 할 수 있는지 알 수 있는 간단한 메서드이다.
어토믹스
멀티스레드 환경을 지원하기 위해 어토믹스가 도입되었다.
Atomics 오브젝트는 atomic operations 정적메소드로서 제공됩니다. 다음과 같은 오브젝트와 함께 SharedArrayBuffer 사용합니다.
어토믹스는 정적이므로 new를 이용해서 사용하거나 함수 형태로 호출 할 수 는없다.
Atomics.add()/.sub()/.load()/.store()
const buffer = new SharedArrayBuffer(16);
const uint8 = new Uint8Array(buffer);
uint8[0] = 10;
console.log(Atomics.add(uint8, 0, 5)); // 10
console.log(uint8[0]); // 15
console.log(Atomics.load(uint8, 0)); // 15먼저 add()의 사용법이다.
간단하게 위 예제를 보면 어떻게 사용하는지 알 수 있다. 파라메터로 대상 배열 그리고 위치 그리고 더하고자 하는 값을 더하면 그 위치의 값을 바꿔주는 모습을 볼 수 있다.
그리고 load()를 사용한 모습도 볼 수 있다. 잘보면 대상배열의 첫번째 파라메터로 주고 두번째 파라메터로 배열의 인덱스를 넣는것을 볼 수 있다.
sub()는 add()와 반대로 값을 빼주는 메서드이다.
store()는 특정값을 배열의 특정 인덱스에 넣는 역할을 하는 메서드이다.
const buffer = new SharedArrayBuffer(16);
const uint8 = new Uint8Array(buffer);
uint8[0] = 10;
console.log(Atomics.sub(uint8, 0, 5)); //10
console.log(uint8[0]); //5
console.log(Atomics.store(uint8, 0, 23)); //23
console.log(uint8[0]); //23위 예제를 보면 쉽게 알 수 있다.
