Front-end22 [Javascript] Method와 함수의 차이 메서드와 함수가 동일시되는 다른 언어와 달리 Javascript에서는 Method와 함수에 차이가 존재한다. 메서드 vs 함수 메서드와 함수는 호출 방식에 따라 다르다. 함수를 호출하는 객체가 있을 경우에 메서드라고 하고, 함수를 호출하는 객체가 없는 경우 함수라고 한다. let obj = { show1: function() { console.log('show1() 메서드 호출'); } } function show2() { console.log('show2() 함수 호출'); } obj.show1(); // 메서드 show2(); // 함수 위 예제에서 show1() 함수는 객체 obj의 프로퍼티이며, obj 객체를 통해 호출했으므로 메서드이다. 반면에 show2() 함수는 객체를 생성하지 않고 직접 호.. 2023. 8. 26. [Javascript] this란 무엇인가 Javascript에서 쓰이는 this란 무엇일까 Javascript에서의 this와 다른 언어에서 쓰이는 this는 의미가 다르다. 다른 언어에서 쓰이는 this는 해당 코드를 실행하는 클래스의 인스턴스를 의미한다. (지시어의 의미) Javascript는 쓰임이 다르고 종류도 다양하다. 기본 바인딩 (Default Binding) 바인딩이란 데이터와 변수값을 묶는 것을 말하며, 기본 바인딩은 다른 바인딩에 해당하는 것이 없을 경우에 적용된다. 기본 바인딩의 경우 this는 전역 객체에 바인딩된다. function foo() { const a = 10; console.log(this.a); } foo(); // undefined 다음 코드를 살펴보면 foo()함수를 실행시키면, 콘솔창에 10이 아닌 un.. 2023. 8. 26. [Javascript] Shadow DOM과 event.composed DOM과 캡슐화 DOM(Document Of Model)은 HTML의 구조화된 문서 표현이다. DOM은 브라우저가 페이지에 어떤 것을 만들지 결정한다. HTML 문서의 모든 요소와 스타일로 이루어진 DOM은 하나의 큰 글로벌 범위 내에 있다. 이 중 몇몇 요소들은 글로벌에 영향을 받지 않는 즉, 완전한 캡슐화를 필요로 하는 요소들도 있다. 예를 들어 iframe 태그는 전역CSS에 영향을 받지 않고 의도된 스타일로 나타나길 보장받을 수 있다. Shadow DOM이란 과 같은 도구 없이도 캡슐화를 허용하도록 만들어졌다. Shadow DOM이란 Shadow DOM은 DOM안의 DOM 이라고 표현할 수 있지만 제대로 표현하자면, 원래의 DOM 트리에서 완전히 분리된 고유의 요소와 스타일을 가진 DOM 트리다... 2023. 8. 15. [Javascript] Base64 사용 방법과 사용 이유 (feat. btoa, atob) Base64 인코딩 사용이유 Base64란 8비트 이진 데이터(ex. 실행파일, zip파일 등)를 문자 코드에 영향을 받지 않는 ASCII 영역의 문자들로만 이루어진 일련의 문자열로 바꾸는 인코딩 방식이다. 즉, 원본 문자열 > ASCII binary > 6bit로 cut > Base64 인코딩 순서로 Base64 인코딩이 진행된다. Base64 인코딩을 사용하는 이유는 암호화나 압축체계가 아니라, 통신과정에서 바이너리 데이터 형태의 손실을 막기 위해서다. 그저 네트워크를 통해 난독화된 문자열을 전송할 수 있는 바이너리 데이터를 ASCII 코드로 변환시킨다. Javascript에서 Base64 사용 방법 btoa() btoa(Binary to ASCII) 바이너리 데이터를 ASCII코드로 변환시킬 때 사.. 2023. 8. 15. 이전 1 2 3 4 ··· 6 다음
