728x90 Language/JavaScript19 [JavaScript] 옵셔널 체이닝 옵셔널 체이닝 '?.'이란? optional chaining 연산자 (?.) 는 체인의 각 참조가 유효한지 명시적으로 검증하지 않고, 연결된 객체 체인 내에 깊숙이 위치한 속성 값을 읽을 수 있습니다. ?. 연산자는 . 체이닝 연산자와 유사하게 작동하지만, 만약 참조가 nullish (null 또는 undefined)이라면, 에러가 발생하는 것 대신에 표현식의 리턴 값은 undefined로 단락된다. 함수 호출에서 사용될 때, 만약 주어진 함수가 존재하지 않는다면, undefined를 리턴합니다. 따라서 참조가 누락될 가능성이 있는 경우 연결된 속성으로 접근할 때 더 짧고 간단한 표현식이 생성됩니다. 어떤 속성이 필요한지에 대한 보증이 확실하지 않는 경우 객체의 내용을 탐색하는 동안 도움이 될 수 있습니.. 2023. 1. 18. [TIL] JavaScript - tilde( ~ ), double tilde( ~~ ) 서론 알고리즘 문제를 풀면서 신기한 연산자를 봤습니다. 물결을 두 번 써서 알고리즘 문제를 풀으셨길래 궁금해서 찾아보니 double tilde 연산자가 검색되었습니다. 블로그 정리하면서 천천히 공부해 보려고 합니다. tilde( ~ ) 연산자 우선 tilde( ~ ) 연산자는 비트 연산자이며 NOT의 기능을 한다고 합니다. 비트(bit) 단위로 논리 연산을 수행하기 때문에 비트가 1이면 0으로, 0이면 1로 반전시킵니다. const a = 5; // 0000000000000101 console.log(~a); // 1111111111111010 // -6 const b = -3; // 1111111111111101 console.log(~b); // 0000000000000010 // 2 위의 식을 예로.. 2022. 12. 12. [TIL] JavaScript - This (bind, call, apply) call call()은 이미 할당되어있는 다른 객체의 함수/메소드를 호출하는 해당 객체에 재할당할때 사용됩니다. this는 현재 객체(호출하는 객체)를 참조합니다. 메소드를 한번 작성하면 새 객체를 위한 메소드를 재작성할 필요 없이 call()을 이용해 다른 객체에 상속할 수 있습니다. 구문 func.call(thisArg[, arg1[, arg2[, ...]]]) thisArg : func 호출에 제공되는 this 의 값입니다. 예제 const pokemon = { firstName: "Pika", lastName: "Chu", getPokemonName: function () { const fullName = this.firstName + " " + this.lastName; return fullNa.. 2022. 12. 7. [TIL] JavaScript - This This란? 다른 객체지향 언어에서는 this는 곳 클래스로 생성한 인스턴스를 말합니다. 하지만 JavaScript에서 함수의 this 키워드는 다른 언어들과 비교하여 조금 다르게 this는 어디에서나 사용될 수 있습니다. 대부분의 경우, this의 값은 함수를 호출하는 방법에 의해 결정됩니다. 실행하는 동안의 할당에 의해 설정될 수 없고, 함수가 호출될 때마다 다를 수 있습니다. this의 이해 this가 어떤 값과 연결되는 지는 this의 바인딩을 통해서 확인해 볼 수 있습니다. 바인딩이란, this의 호출 방식에 따라서 this가 특정 '객체'에 연결되는 것입니다. this의 바인딩은 일반 함수 내부, 메서드 내부, 생성자 함수 내부, Call, Apply, Bind를 통한 '호출 방식'으로 나눠서.. 2022. 12. 6. [TIL] JavaScript - 구조 분해 할당 (Destructuring) 구조 분해 할당(Destructuring) 이란? 배열 [ ] 이나 객체 { } 의 속성을 분해해서 그 값을 변수에 담을 수 있게 해주는 문법입니다. 배열 구조 분해 // 배열의 경우 let [value1, value2] = [1, "new"]; console.log(value1); // 1 console.log(value2); // "new" let arr = ["value1", "value2", "value3"]; let [a,b,c] = arr; console.log(a,b,c) // value1 value2 value3 // let [a,b,c] = arr; 은 아래와 동일! // let a = arr[0]; // let b = arr[1]; // let c = arr[2]; //일부 반환 값 무.. 2022. 12. 5. [TIL] JavaScript - DOM 서론 JavaScript를 공부하면서 DOM이 뭐냐는 질문을 들었을 때, 바로 대답이 안 나왔습니다... DOM을 항상 사용하면서 뭐냐는 질문이 들어오면 선뜻 대답하지 못하는 제 자신을 보고 아직 한참 멀었다는 것을 느끼게 되었습니다 그래서 다시 공부해보려 합니다!! DOM이란? 문서 객체 모델(The Document Object Model, 이하 DOM) 은 HTML, XML 문서의 프로그래밍 interface 이다. DOM은 문서의 구조화된 표현(structured representation)을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕는다. DOM 은 nodes와 objects로 문서를 표현한다. 이들은 웹 페.. 2022. 12. 1. 이전 1 2 3 4 다음 728x90
