Front (30) 썸네일형 리스트형 함수의 호출(call & apply) 함수를 호출하는 방법 1. 함수(파라미터인자) : 가장 기본적인 방법 2. 함수.call(null, 파라미터인자1, 파라미터인자2, ..) : 함수.call()을 생략하여 더 간단하게 호출할 수 있게 한 것이 1번 3. 함수.apply(null, 파라미터인자 배열) : apply의 첫번째 인자를 null로 하고, 두번째 인자를 배열형식으로 한다면 1,2번과 같은 결과가 나온다. apply의 사용 apply(this로 보내고 싶은 객체, 파라미터인자 배열) const obj = { msg : 'hello' } function print(){ console.log(this.msg); } print.apply(obj); // 결과: hello가 출력된다. 이것은 흡사 obj안에 print함수를 넣은 것과 같은.. arguments VS parameter arguments VS parameter arguments : 함수를 호출할 때 함수에 전달된 인자들 (배열과 유사하지만 배열은 아니고, arguments 객체의 인스턴스) parameter : 함수에 정의된 변수. 자바스크립트에서는 함수에 정의된 변수의 개수와 다르게 함수를 호출할 수 있다. function print (a){ // parameter가 1개 console.log(a); } print(1, 2); // 호출할때는 두개의 데이터를 넣을 수 있다. 이 때, 1과 2라는 데이터가 arguments 이다. arguments는 배열처럼 함수로 전달된 인자들의 값을 가지고 있다. arguments[0] : 함수로 전달된 인자들 중 첫번째 값 arguments.length : 함수로 전달된 인자의 개.. 클로저(closure) 클로저(closure) 내부함수가 외부함수의 맥락에 접근할 수 있는 것 function outter(){ var title = 'Hello world'; return function (){ alert(title); } } var inner = outter(); inner(); 외부함수가 종료된 이후에도 내부함수에서 외부함수의 지역변수에 접근할 수 있다. 위의 코드에서 outter()가 한번 실행되고, 그 결과로 반환된 함수가 inner에 할당 되었다. outter는 이미 종료되었지만, inner 함수를 호출할 때 마다 outter의 지역변수인 title에 접근이 된다. private variable 정보를 아무나 수정하는 것을 방지하기 위해 사용된다. function factory_movie (titl.. 값으로서의 함수(변수, 매개변수, 리턴값, 객체속성, 배열값) & 콜백 함수와 메소드 용어의 차이 1. 함수 : 그냥 정의된 함수 function a(){} 2. 메소드 : 객체 안에 정의된 함수 a = { b : function(){ } } 값으로서의 함수 함수는 값으로서 사용할 수 있기 때문에 아래와 같이 사용 가능하다. - 변수에 할당 - 매개변수 - 리턴값 - 객체의 속성값 - 배열안의 값 * 프로그래밍에서는 변수, 함수의 매개변수, 리턴값 과 같은 용도로 사용될 수 있는 형태의 데이터를 first-class citizen 또는 first-class object 라고 한다. 콜백 다른 함수에 대한 인자로 전달되어 호출되는 함수. 콜백 - 처리의 위임 function sortNumber(a,b){ // 위의 예제와 비교해서 a와 b의 순서를 바꾸면 정렬순서가 반대가 된.. 변수의 유효범위 (지역변수, 전역변수) 불가피하게 전역변수를 사용해야 하는 경우는 하나의 객체를 전역변수로 만들고 객체의 속성으로 변수를 관리하는 방법을 사용한다. (function(){ 위의 MYAPP변수와 관련된 코드들 ~~~ }()) 함수의 이름을 붙이지 않고 정의하는것 -> 익명함수 함수 뒤에 ()를 붙이면 바로 실행한다는 의미 함수를 괄호()로 감싸면???? 위의 방법은 자바스크립트에서 로직을 모듈화 하는 일반적인 방법이다. 유효범위의 대상 (함수) JAVA에서는 for문, if문의 중괄호 블록도 지역변수가 될 수 있는 유효범위가 되지만, 자바스크립트에서는 for, if문안에서 선언된 변수는 지역변수가 아니다. 함수안에서 선언된 변수만이 지역변수가 된다 (함수만 유효범위가 될 수 있다) 정적유효범위 함수 b가 정의될 때를 기준으로 변.. Interface(인터페이스) - UI(User Interface) & API(Application Programming Interface) Interface (인터페이스) 계층적인 관계의 접점이 되는 것을 인터페이스라고 한다. UI (User Interface) 사용자를 대면하는 접점이 되는 지점. 1. 노트북의 입력장치, 출력장치 (하드웨어적 UI) 사용자가 입력할 수 있는 키보드, 터치패드 등과 같은 입력장치 컴퓨터의 상태 등을 밖으로 출력해 주는 모니터, 스피커 등과 같은 출력장치 2. 윈도우 바탕화면, 웹 브라우저 UI (소프트웨어적 UI) 사용자의 의중을 시스템에게 전달하고, 시스템의 상태를 사용자에게 보여준다. 사용자가 클릭하면 원하는 값을 출력해낼 수 있음. API (Application Programming Interface) 코드의 형태를 띄고 있는 인터페이스. ** API 사용해보기 주소창 아래와 같이 입력하면 웹브라우저에.. 모듈(Module) & 라이브러리 - 호스트 환경에 따른 모듈의 로드 모듈 복잡한 코드를 서로 관련 있는 객체나 함수끼리 정리하여 여러개의 파일로 분리한다. 순수한 자바스크립트에서는 모듈이라는 개념이 분명하게 존재하지는 않는다. 자바스크립트에서만 사용하는 용어가 아니고, 프로그래밍에서 일반적으로 사용하는 용어. 라이브러리 목적을 정해놓고 목적을 쉽게 달성할 수 있도록 만들어놓은 코드들의 집합 예) jQuery - jQuery를 사용하기 위해서는 jQuery의 모듈들을 다운받아서 프로젝트에 넣어야 함. 음.. 그럼 차이점이 뭘까??!! 여러개의 파일로 분리되었을때 하나의 파일을 모듈. 라이브러리는 여러개의 모듈들로 만들어진 기능을 가진 커다란 모듈덩어리라고 생각한다. (라이브러리가 모듈보다 더 큰 범위) 또한 라이브러리는 프로그램을 개발할 때 많이 사용하는 기능들을 여러 사.. HTML <canvas> 태그 - 초록색 사각형 그리기 1. html 2. java script const canvas = document.getElementById('canvas'); const ctx = canvas.getContext('2d'); ctx.fillStyle = 'green'; ctx.fillRect(10, 10, 150, 100); 출처 developer.mozilla.org/ko/docs/Web/HTML/Element/canvas developer.mozilla.org/ko/docs/Learn/JavaScript/Building_blocks/Looping_code 이전 1 2 3 4 다음
