본문 바로가기
반응형

JavaScript8

[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이 아닌 undefin.. 2023. 8. 26.
[Javascript] 이벤트 처리 방법 onClick vs EventListener 차이점 Button을 클릭 후, 실행할 함수를 정의하기 위해선 onClick 혹은 eventListener로 함수를 정의할 수 있다. 그러면 다음 두가지의 차이점을 무엇일까? onClick의 경우는 하나의 콜백만 지정할 수 있으나, EventListener의 경우에는 여러 개의 콜백을 지정할 수 있다. onClick onClick 이벤트 핸들러를 두번 사용하게 되면 가장 나중에 선언한 이벤트 핸들러가 작동하게 된다. var btn = document.getElementById('btn'); btn.onclick = function() { alert('onclick-1'); } btn.onclick = function() { alert('onclick-2'); } 즉, 다음 코드를 실행할 경우, alert 창에 .. 2022. 4. 3.
[Javascript] 배열에서 특정 값 찾기 배열 속 값 탐색하기 indexOf let arr1 = ['apple', 'banana', 'peach', 'tomato']; console.log(arr1.indexOf('banana')); // 결과값: 2 console.log(arr1.indexOf('lemon')); // 결과값: -1 indexOf 메서드는 배열 안에서 특정 문자열에 해당하는 위치를 찾을 수 있다. 일치하면 값이 배열 속 문자열이 존재하는 위치를 나타내며, 일치하지 않으면 -1이 결과값으로 나타난다. find // 배열일 경우 const array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; // callback(element, index, array) array.find(v => v > 5); // 6 fin.. 2022. 3. 31.
[MySQL] Node js에서 SQL과 동적으로 매핑하는 방법 기본 하드코딩 var clubSn = req.params.clubSn; var sql = 'SELECT * FROM CLUB WHERE CLUB_SN = "' + clubSn + '";'; dbconn.query(sql, function(err, results, field){ .... }); 파라미터 1개일 때 매핑 var clubSn = req.params.clubSn; var sql = 'SELECT * FROM CLUB WHERE CLUB_SN = ?'; dbconn.query(sql, clubSn, function(err, results, field){ ... }); 파라미터 2개이상일 때 var clubSn = req.params.clubSn; var clubNm = req.params.club.. 2022. 3. 22.
[Javascript] Callback, Promise, Async await 차이점과 사용법 Callback, Promise, Async await를 살펴보기에 앞서... 자바스크립트 엔진은 코드를 동기적으로 실행하기 때문에, 코드 중간에 엄청난 로직의 함수를 실행한다면 병목 현상이 생길 것이다. 그래서 사용하는 것이 비동기 함수다. Callback 매개변수를 변수가 아닌 함수로 받는 함수 function callbackFun(inputFun) { console.log('매개변수 받는 함수'); inputFun(); } function inputFun(){ console.log('매개변수 함수'); } Promise 비동기 작업을 처리하는 함수 const promise1 = new Promise((resolve, reject) => { resolve(); }); promise1 .then(() .. 2022. 3. 19.

티스토리툴바