[JS] 대상 조작의 방법 총결

제목에 대한 지적이 있어서 변경되었다.
본고는 대상(연상 배열)에 사용되는 방법을 소개할 것이다.

객체인지 여부를 결정합니다.

대상인지 아닌지 판단이 까다롭다.
typeof를 사용하면 null과 배열도 Object로 판정되기 때문이다.
대충 느낌을 조사해 보니 아래의 작법이 비교적 좋다고 생각한다.

const obj = { id: 1, name: "obj", length: 3 };
const arr = [0, 1, 2];

// true
console.log(Object.prototype.toString.call(obj) === "[object Object]");
// false
console.log(Object.prototype.toString.call(arr) === "[object Object]");

이렇게, Object.prototype.toString.콜()을 사용하면 Object형의 무엇인지 알 수 있습니다.

속성 이름 유무 확인

다음은 속성 명칭이 있는지 없는지를 확인하는 방법으로 주로 두 가지가 있다.
1.hasOwnProperty
2. in 연산자
둘 다 실제로 사용한다면 다음과 같다.

const obj = { id: 1, name: "obj", length: 3 };

// true
console.log(obj.hasOwnProperty("id"));
// true
console.log("id" in obj);

두 가지 행위는 기본적으로 같지만 조금 다르면hasOwn Property를 사용하면 문제없다.
양자의 차이를 의식하는 사람은 조사해 보세요.

정적 방법

대상의 정적 방법은 주로 다음과 같은 세 가지가 있다.

Object.keys 방법: 대상 속성 이름의 배열을 되돌려줍니다

Object.values 방법: 대상 값의 배열에 따라 되돌아오기

Object.entries 방법: 대상 속성 이름과 값의 배열을 되돌려줍니다

각각 실제 사용한다면 다음과 같다.

const obj = { id: 1, name: "obj", length: 3 };

// [ “id”, “name”, “length”]
console.log(Object.keys(obj));
// [ 1, “obj”, 3 ]
console.log(Object.values(obj));
// [ [ “id”, 1 ], [ “name”, “obj” ], [ “length”, 3 ] ]
console.log(Object.entries(obj));

저는 실제 사용 방법으로 여기서 맵과 forEach 등을 사용하는 경우가 비교적 많다고 생각합니다.

끝말

우리는 이미 각양각색의 대상 조작 방법을 보았다.
만약 모르는 방법이 있다면 반드시 오늘부터 사용하세요.
또한 제 블로그에는 React 엔지니어가 되는 로드맵이 무료로 공개되어 있으니 참고하시기 바랍니다.백엔드 엔지니어가 되고 싶은 사람에게도 도움이 된다는 메시지가 적혀 있다.
https://hinoshin-blog.com/react-roadmap/
끝맺다