본문 바로가기

js/개발22

js 프로퍼티 어트리뷰트 js 엔진에서는 프로퍼티를 생성할 때,프로퍼티 어트리뷰트라는 상태값을 자동으로 부여해줌  - value : 프로퍼티의 값 - writable : 값의 갱신 가능 여부 - enumerable : 열거 가능 여부 - configurable : 재정의 가능 여부/프로퍼티 어트리뷰트 재정의 가능 여부 프로퍼티 어트리뷰트는 js 엔진이 관리하는 내부 상태 값인 내부슬롯이라 직접접근은 못 함.하지만 Object.getOwnPropertyDescriptors 메서드를 통해 간접 확인은 가능보다시피 자동으로 프로퍼티 어트리뷰트 값이 부여됨직접 설정해주고 싶으면 아래처럼 Object.defineProperty 메서드를 이용해 프로퍼티를 생성함Object.defineProperty(person,'name',{ val.. 2022. 12. 3.
js 함수내부에서의 this 바인딩 자바스크립트에서는 상황에 따라 this 객체에 바인딩되는 값이 다름 1.화살표함수는 자신의 상위객체에 대해 접근함2. 메소드 호출 시 메소드 내부의 this는 해당 메소드를 보유한 객체로 바인딩된다. 3. 일반함수 호출 시 함수 내부의 this는 전역객체에 바인딩된다. 4. 생성자 함수라면 생성자 함수에서 객체를 생성 후, 해당 객체에 this가 바인딩된다. 여기서 메소드는 객체내부에 일부로서 함수의 프로퍼티,값 쌍이 존재할 때그 함수를 메소드라 부름1번 예시this.a = 5;const eee = () => { console.log(this.a) // 화살표함수는 상위 객체인 전역객체를 this에 바인딩함.}eee(); // 5 2번 예시const bbb = { name:'bbb', f.. 2022. 12. 3.
js Symbol 데이터 타입 심벌이란?다른 값과 중복되지 않는 유일무이한 값이며 주로 충돌위험이 없게 유일한 프로퍼티 키를 만들기 위해 사용함심벌 값의 생성const mySymbol = Symbol();console.log(mySymbol); // Symbol()// 심벌 값은 외부로 노출되지 않아 확인할 수 없다.언뜻 보면 생성자 함수로 심볼객체를 생성하는 것처럼 보이지만new 연산자와 함께 호출하지 않고, 객체대신 원시값인 심볼이 생성된다.Symbom 함수에는 문자열을 인수로 전달할 수 있으며 이 인수는 키 값/설명으로써 사용된다.const symbol1 = Symbol("1");const symbol2 = Symbol("2");console.log(symbol1===symbol2); // false심벌 값의 생성 - for 메.. 2022. 10. 17.
js set 데이터 타입 set은 ES6에 공개된 배열과 비슷한 데이터 구조임 배열과 다른점은 중복을 허용하지 않는다 대충 아래와 같이 생성let a = [1,2,3,4,4,5,6,6,6];let b = new Set([1,2,3,3,4,5]);console.log(a); //[1, 2, 3, 4, 4,5, 6, 6, 6]console.log(b); //Set(5) { 1, 2, 3, 4, 5 }b = new Set(a);console.log(b); //Set(6) { 1, 2, 3, 4, 5, 6 }추가적으로 아래와 같은 메소드들이 있다. add 더하고size 길이clear 초기화delete 인덱스넣으면 해당 번호의 요소 없애기일듯 let a = new Set();console.log(a) // Set(0) {}a.add(5).. 2022. 10. 17.
js 즉시실행함수 즉시실행함수란 정의되자마자 실행해버리는 함수를 말함.function shouting() { console.log(str)}shouting('으악'); // 으악 1. 함수를 선언하고,2. 바로 호출 위의 기존코드를 즉시실행함수로 바꾸면 아래와 같음(function shouting(str) { console.log(str)})('으악');const shouting = function (str) { console.log(str)}('으악');const shouting2 = ((str) => { console.log(str)})('으악');위 코드를 실행시>> 으악>> 으악>> 으악함수들이 바로 실행됐단 걸 확인가능함  그런데 신기한 점이 하나 있는데,shouting함수가 두 번 선언이 되어있.. 2022. 5. 31.
js ajax로 비동기 통신하기 기존 클라이언트가 서버에 요청을 할 때는 매번 전체 페이지를 새로 렌더링을하며 불편함을 줬었다.=> AJAX는 이 불편함을 없애기 위해 등장한 것=> 서버와 비동기적으로 http 통신을하며 일부 내용만 교체를 함 ajax 기술의 핵심에는 XMLHttpRequest 객체가 있습니다.이 객체를 통해 서버와 통신할 수 있습니다.옛날 브라우저에선 XMLHttpRequest 객체대신 ActiveXObject를 쓴다네요1. 기존 XMLHttpRequest 통신방법const httpRequest = new XMLHttpRequest()httpRequest.open("POST", "/examples/media/request_ajax.php", true);httpRequest.setRequestHeader("Conten.. 2022. 2. 4.

티스토리툴바