본문 바로가기

반응형

개발/javascript&jquery

(17)
불필요한 return 사용을 줄이자. void vs return 불필요하게 return을 쓰는 행위를 줄이자.void 연산자는 undefined를 반환한다. function click() { return setState(false)} function click(message) { return alert(mesasge)}리액트에 있는 setState, 윈도우 alert 은 void함수이다.함수의 반환이 존재하지 않는다.굳이 return을 넣어줄 필요가 없다.//개선전 코드function click(message) { if(...) { return alert(meeage) } ...some code... }함수를 조작하기 위해서 위와 같이 사용하는 경우가 있음 이럴 경우에도 반환이 없는 함수에 return을 붙이지 말고 각자 명확하게 구분하는게 ..
Rest Parameters 나머지 매개변수 인자가 가변적으로 들어올 때 사용할 수 있는 변수실제 배열로 받아서 사용가능//개선전코드function sumTotal() { return Array.from(arguments).reduce( (acc, curr) => acc + curr );}//개선된코드funcion sumTotal(...args) { //rest parameters로 들어오면 배열이기 때문에 Array.from사용할 필요 없음 return args.reduce( (acc, curr) => acc + curr );}sumTotal(1,2,3,4,5,6,7,8,9)//개선된 코드의 장점= 추가인자를 받을 수 있다.function sumTotal(initValue, ...args) { console.info(i..
복잡한 인자 관리하기 복잡한 인자를 관리할때 1. 객체로 사용하기function createCar(name, brand, color, type) { return { name, brand, color, type }}function createCar({name, brand, color, type}) { return { name, brand, color, type }}첫번째 인자는 중요하고 나머지는 옵션이다는걸 명시적으로 보여줌 function createCar(name, { brand, color, type}) { return { name, brand, color, type ..
[css template bootstrap] Html Contact Us, 문의하기 구글 메일 연동 간단한 홈페이지를 개발 중 문의하기 메일연동이 필요했습니다. 서버를 사용하지 않고 html에서 구글 메일을 연동해 사용할 수 있습니다. 참고 https://github.com/dwyl/learn-to-send-email-via-google-script-html-no-server#how GitHub - dwyl/learn-to-send-email-via-google-script-html-no-server: An Example of using an HTML form (e.g: "Contact Us" on a web :email: An Example of using an HTML form (e.g: "Contact Us" on a website) to send Email without a Backend Ser..
함수선언식 함수표현식 차이 //function statement 함수 선언식 function sum() { return 10 + 20; } //function expression 함수 표현식 var sum = function() { return 20 + 20; } sum() //40; 함수선언: 변수를 선언할때 var를 사용하는것처럼 함수를 사용할때 function을 선언함 함수표현: 함수를 표현한 문장으로 변수에 저장가능, 해당 변수를 함수처럼 사용 가능하다. var변수를 선언하는것과 마찬가지로, 함수를 선언한 함수표현식은 호이스팅 된다. (브라우저가 자바스크립트를 해석할 때 맨 위로 끌어 올려진다.)
ES5 특징 - 변수 Scope(스코프), Hoisting(호이스팅) 자바나 기타 다른 언어를 하고 자바스크립트를 공부하면 ES5특징에서 헷갈리는 부분들이 있다. ES5 특징 - 변수의 Scope(범위) 기존 자바스크립트(ES5)는 { } 에 상관없이 스코프가 설정됨 자바에서는 for문에서 사용한 i는 보통 for문 {}안에서만 사용이 가능한데, ES5는 for문에서 사용한 i가 전역변수로 설정된다. var sum = 0; for (var i=1; i
[jQuery] Dom&Node 관계 / Dom객체 자바스크립트+jQuery 완전정복 스터디 2권 (JQuery 기초와 활용) 스터디 정리 JQuery란 자바스크립트 DOM 작업을 좀더 쉽게 처리할 수 있게 도와주는 라이브러리이다. JQuery를 알기 위해선 자바스크립트 DOM을 먼저 학습해야 한다. 자바스크립트 DOM (Document Object Mode) : 웹 화면에 보이는 요소를 조작하기 위한 기능으로 가득 찬 라이브러리 덩어리이다. 노드, 스타일, 속성, 이벤트, 위치 및 크기 등을 다룰 수 있는 다양한 기능이 포함되어 있다. 1. W3C DOM vs 브라우저 DOM DOM은 정의부분(명세서)와 구현부분으로 나누어 진다. 정의 부분인 명세서에는 웹페이지(XML)문서를 조작할 때 지켜야 할 약속이 명시되어 있는 문서일뿐 실제 동작하는 구현 소스코..
[jQuery] 다른 페이지로 이동 할 때 .unload() .unload()는 사용자가 다른 페이지로 이동할때 사용합니다. .on( "unload", handler ) This could mean one of many things. The user could have clicked on a link to leave the page, or typed in a new URL in the address bar. The forward and back buttons will trigger the event. Closing the browser window will cause the event to be triggered. Even a page reload will first create an unload event. link 클릭, 페이지 떠날때, 앞으로 가기, 뒤로가기..

반응형