본문 바로가기

자바스크립트

(52)
돔 엘리먼트 안의 텍스트 변경하기 - innerHTML let ele = document.getElementById('ele'); ele.innerHTML = '글자 추가'; 글자 추가
돔 엘리먼트 가져오기 1 - querySelector 메소드 1 2 3 document.querySelector('#one'); // 1를 가져온다. document.querySelector('.group'); // 첫 번째 group 클래스인 2를 가져온다. // 또는 document.querySelectorAll('.group')[0]; document.querySelectorAll('.group'); // group 클래스를 유사 배열로 가져온다. // [div.group, div.group]
자바스크립트 재귀함수 예제 - 배열에 숫자만 남기기 function leaveArrayNumber(arr) { let arrNew = arr.slice(); let result = []; function recursion(arrSub) { if(arrSub.length
자바스크립트 재귀함수 예제 - 배열의 값 모두 더하기 function sumArray(arr) { let arrNew = arr.slice(); let result = 0; function recursion(arrSub) { if(arrSub.length
자바스크립트 재귀 함수 예제 - 다중 배열 한 배열로 바꾸기 let arr = [1, 2, [3, 4, [5, 6], 7, 8], 9, 10]; function convertOneArray(arr) { let newArr = []; function recursion(arr) { for(let i = 0; i < arr.length; i++) { // 값이 배열이면 recursion 함수를 다시 호출한다. if(Array.isArray(arr[i])) { recursion(arr[i]); // 값이 일반적인 숫자면 newArr 배열에 추가한다. } else { newArr.push(arr[i]); } } } recursion(arr); return newArr; } console.log(getOneArray(arr)); // [1, 2, 3, 4, 5, 6, 7, ..
자바스크립트 프로토타입(prototype) 이해하기 크롬 빈탭의 콘솔창을 열어(F12) 객체를 생성하고 console.dir() 메소드를 이용해서 객체의 속성에 뭐가 들었는지 확인해보면 정의해놓은 prop1, prop2, prop3 뿐만 아니라 __proto__라는 속성이 반투명하게 보인다. 위와 같이 객체에는 무조건 __proto__라는 속성이 포함된다. 이 속성은 상속한 부모의 prototype을 가리키는 속성이다. obj는 상속하는 부모 객체의 prototype에 들어있는 속성을 그대로 가져다 obj의 __proto__에 가져오게 된다. (정확히 말하자면 공유하는 것, 링크) 객체를 만들면 기본적으로 Object라는 최상위 객체를 상속하기 때문에 obj.__proto__ 안에는 Object.prototype의 속성이 들어가게 된다. 그래서 어떤 객체..
자바스크립트 bind 메소드 1. 인자를 지정해주기 function add(a, b) { return a + b; } // add 함수에서 첫 번째 인자를 1로 고정시킨 함수를 반환한다. let add1 = add.bind(null, 1); add1(2); // 고정된 1과 인자로 들어간 2가 더해져 3을 반환한다. 2. this를 지정해주기 function getThis() { return this; } // getThis 함수에서 this로 참조하는 값을 []로 하는 함수를 반환한다. let getArray = getThis.bind([]); getArray(); // this로 지정된 []를 반환한다. 3. setTimeout 예제 function Message() { this.firstMessage = function() {..
자바스크립트 API 문서에서 Object 메소드의 prototype 여부에 따른 사용 방법 // API 문서 리스트 중 prototype이 없는 형태 //Object.keys(); let arr = ['a', 'b', 'c']; console.log(Object.keys(arr)); // [0, 1, 2] // API 문서 리스트 중 prototype이 있는 형태 //Object.prototype.toString(); let o = new Object(); console.log(o.toString()); // Object.prototype 형태의 메소드는 모든 객체에서 사용 가능하다. let a = new Array(1, 2, 3); console.log(a.toString());