반응형 JavaScript35 javascript forEach 함수에 대해 알아보자. 자바스크립트 forEach 함수 javascript forEach 함수에 대해 알아보자. 자바스크립트 forEach 함수 이번엔 고차함수 세번째 시간 입니다. 이전 포스팅에서 reduce와 filter 함수에 대해 알아보았죠. Link1 : javascript reduce 함수에 대해 알아보자 자바스크립트 reduce 함수, reduceRight 함수 Link2 : javascript filter 함수에 대해 알아보자 자바스크립트 filter 함수 이제 forEach 함수에 대해 알아보도록 하겠습니다. forEach의 구문은 아래와 같습니다. 1 array.forEach(callbackFunction(currnetValue, index, array), thisArg); cs 매개변수로는 callbackFunction 과 thisArg .. Programing/JavaScript 2017. 9. 7. javascript Math 속성과 메서드에 대해 알아보자. javascript math 자바스크립트 math javascript Math 속성과 메서드에 대해 알아보자. javascript math 자바스크립트 Math 속성명 값 E 2.18281828459045 LN2 0.6931471805599453 LN10 2.302585092994046 LOG2E 1.4426950408889633 LOG10E 0.4342944819032518 PI 3.141592653589793 SQRT1_2 0.7071067811865476 SQRT2 1.4142135623730951 메서드명 설명 abs(x) x의 절대 값을 리턴 acos(x) x의 아크코사인 값을 리턴 asin(x) x의 아크 사인 값을 리턴 atan(x) x의 아크 탄젠트 값을 리턴 atan2(y,x) x와 y의 비율로 아크 탄젠트 값을 리턴 ceil(x) x보.. Programing/JavaScript 2017. 9. 6. javascript filter 함수에 대해 알아보자 자바스크립트 filter 함수 javascript filter 함수에 대해 알아보자 자바스크립트 filter 함수 지난 포스팅에서 자바스크립트 고차함수(High-Order_Function) 중 reduce에 대해 알아보았습니다. Link : javascript reduce 함수에 대해 알아보자 자바스크립트 reduce 함수, reduceRight 함수 이번 포스팅에서는 filter 에 대해서 알아보도록 하겠습니다. filter 함수는 명칭과 같이 callbackFunction의 조건에 해당하는 모든 요소가 있는 배열을 새로 생성하는 기능을 합니다. filter 함수의 구문은 아래와 같습니다. const newArray = arr.filter(callbackFunction(element, index, array), thisArg); f.. Programing/JavaScript 2017. 9. 6. javascript reduce 함수에 대해 알아보자 자바스크립트 reduce 함수, reduceRight 함수 javascript reduce 함수에 대해 알아보자 자바스크립트 reduce 함수 자바스크립트에는 고차함수(High-Order-Function : 다른 함수를 소비 또는 생성하는 함수)가 존재 합니다. 여기에는 filter, reduce, map 등이 있는데요, 그중에 reduce에 대해서 먼저 알아보도록 하겠습니다. reduce 함수의 구문은 아래와 같습니다. array.reduce(callbackFunction(previousValue, currentValue, currentIndex, array1), initialValue); 차근차근 설명을 드리겠습니다. reduce함수의 매개변수는 callbackfunction과 initialValue입니다. initialValue 부터 설명을 하자면, cal.. Programing/JavaScript 2017. 9. 5. 자바스크립트 호이스팅 javascript hoisting 의 개념. 이해하기 자바스크립트 호이스팅 javascript hoisting 의 개념. 이해하기 Hoisting 이란 자바스크립트의 기본동작 중에 하나 입니다. 자바스크립트의 변수는 사용된 후에 선언될 수 있습니다. 다른 말로 하면 변수가 선언되기 전에 사용 할 수도 있죠. 이유는 함수 내 여기저기서 변수가 사용될 순 있지만 실제로는 함수 상단에 선언한 것으로 간주하기 때문입니다. 말로는 이해가 잘 되지 않으니 코드를 보도록 하죠. a = 10; function getNum(){ alert(a); var a = 100; alert(a); } getNum(); 위의 코드를 보겠습니다. 간단한 코드이지만 확실히 이해해야 합니다. 함수 전에 전역변수 a에 10이 할당 되었습니다. 그러니 getNum() 함수의 첫번째 alert(.. Programing/JavaScript 2017. 6. 28. Javascript prototype 프로토타입 이란? prototype을 사용하는 방법을 알아보자. Javascript prototype 프로토타입 이란? prototype을 사용하는 방법을 알아보자. 자바스크립트의 모든 객체들은 부모 역할을 하는 객체와 연결 되어 있습니다. (최상위는 Object) 이런 부모 역할을 하는 객체를 javascript에서는 Prototype이라고 합니다. 예제를 보면서 Prototype에 대해 더 알아보도록 하겠습니다. $(function(){ const Student = function(name, korean, english, math){ this.name = name; this.korean = korean; this.english = english; this.math = math; } console.dir(Student); }); Student라는 생성자 함수를 만들.. Programing/JavaScript 2017. 5. 30. javascript closure 자바스크립트 클로저의 개념 쉽게 이해. 클로저란? javascript closure 자바스크립트 클로저의 개념 쉽게 이해. 클로저란? 자바스크립트 하면 빠지지 않는 것 중에 하나가 클로저(Closure) 입니다. 하지만 이것을 사용하지 않는다고 해서 개발을 못하진 않죠. 그렇다고 몰라도 되는 개념은 아닙니다. 클로저의 정의는 매우 다양합니다. 이 책에서는 이렇게 저 책에서는 저렇게 정의 하죠. 예를 들면 '클로저는 내부함수가 외부함수에 context에 접근 할 수 있는 것을 가르킨다.' '생명주기가 끝난 객체에 접근할수 있는 것 이다' '외부함수의 실행이 끝나서 소멸된 후에 내부함수가 외부함수에 변수에 접근하는 매커니즘이다.' 뭐 다 처음에는 뭔데? 하는 생각만 들죠. 여러가지 예를 보면서 이해하는 방법 밖에 없습니다. 자바스크립트의 스코프에 대한 이해.. Programing/JavaScript 2017. 5. 23. Javascript 로컬 파일 실행, 윈도우 프로그램 실행하기 ActiveXObject Javascript 로컬 프로그램, 윈도우 프로그램 실행하기 ActiveXObject 고객요청사항으로 돋보기 같은 기능을 구현해 달라는 요청을 받았습니다... 이미지 돋보기는 여타 많은 쇼핑몰 사이트에 구현이 되어 라이브러리나 소스들이 많지만, 이번 요청은 이미지가 아닌 브라우저 전체 돋보기 기능이였습니다. 그래서 생각한게 윈도우에 있는 돋보기 기능을 활용하면 어떨까 하는 것이였습니다. 하지만 이는 브라우저 설정에서 ActiceX 관련 설정을 풀어주어야 합니다..(보안상 문제가 될 수 있음) (IE 11 기준) 그럼 소스를 우선 보도록 하시죠. - 텍스트 소스 function magnifier(){ try{ var objWSH = new ActiveXObject("WScript.Shell"); var r.. Programing/JavaScript 2017. 3. 15. 자바스크립트 number를 String으로 변환 javaScript toString(), toExponential(), toFixed(), toPrecision(), valueOf() method 자바스크립트 number를 String으로 변환 javaScript toString(), toExponential(), toFixed(), toPrecision(), valueOf() method 자바스크립트의 숫자형을 문자형으로 바꿔주는 메소드는 다음과 같은 것들이 있다. toString() toExponential() toFixed() toPrecision() (모든 숫자형 메소드는 원래의 값을 변경하지 않고 새로운 값을 리턴한다.) 그럼 이제 각각의 숫자형 메소드에 대해서 알아보자. - toString() toString() 메소드는 숫자값을 String으로 바꾸어 리턴한다. 숫자형 메소드는 어느타입의 숫자형이든 사용할 수 있다. 예) var x = 123; var y = x.toString(); .. Programing/JavaScript 2015. 8. 10. 자바스크립트 문자열을 배열로 바꾸기 javaScript split() method 자바스크립트 문자열을 배열로 바꾸기 javaScript split() method 문자열을 split() 메소드를 사용하여 배열로 변환 할 수 있다. - split() 사용방법 문자열.split(구분자); 예) 1 2 3 4 5 6 7 8 9 function splitFunction() { var str = "서울, 대전, 대구, 부산"; var arr = str.split(","); var result = arr[0]; document.write(result); } cs 결과값은 "서울" 구분자로 값을 구분해, 배열로 가져올 수 있다. 주민번호나 우편번호 같이 중간에 "-" 과 같은 것을 입력받을 때 구분해서 저장하는데 사용하면 유용하다. 구분자를 생략하면 전체 스트링값이 0번째 인덱스 값이 된다. 예.. Programing/JavaScript 2015. 7. 24. 자바스크립트 인덱스 값으로 문자 추출 javaScript charAt(), charCodeAt() 자바스크립트 인덱스 값으로 문자 추출 javaScript charAt(), charCodeAt() 인덱스 값으로 문자값을 추출하는데는 charAt() 메소드를 사용한다. - charAt()사용방법 문자열.charAt(인덱스값); 예) 1 2 3 4 5 6 var str = "Challenge"; var result = str.charAt(0); document.write(result); cs charAt(0) 으로 0번째 인덱스를 갖은 "C"를 추출한다. C(0)h(1)a(2)l(3)l(4)e(5)n(6)g(7)e(8) 결과값 C 문자의 아스키코드값을 추출하는데는 charCodeAt() 메소드를 사용한다. - charCodeAt() 사용방법 문자열.charCodeAt(인덱스값); 예) 1 2 3 4 5 .. Programing/JavaScript 2015. 7. 24. 자바스크립트 문자열 자르기 javsScript slice(), subString(), subStr() method 사용법 자바스크립트 문자열 자르기 javsScript slice(), subString(), subStr() method 사용법 자바스크립트에서 문자열을 잘라 리턴하는 메소드는 3가지가 있다. 1. slice() 2. substring() 3. substr() 그럼 slice()부터 사용법에 대해 알아보자. - slice 사용방법 문자열.slice(잘라올 첫 위치값, 잘라올 마지막 위치값) 여기서 잘라올 첫번째 위치값은 이상 이고 잘라올 마지막 위치값은 미만이라고 생각하면 편하다. 다시 말해 첫 위치값은 리턴값에 포함되며 마지막 위치값은 미포함된다. 주의하자. 아래의 예를 보자 예) 문자열의 인덱스 값을 모른다면 아래의 링크를 참조하자. Link : 자바스크립트 javaScript indexOf(), lastI.. Programing/JavaScript 2015. 7. 23. 자바스크립트 javaScript indexOf(), lastIndexOf() methods 자바스크립트 javaScript indexOf(), lastIndexOf() methods indexOf() 메소드는 파라메터와 같은 문자 or 문자열을 처음부터 찾아 몇번째 위치하는지 리턴하는 메소드다. -사용방법 문자열.indexOf("찾을문자열", 검색을 시작할 인덱스값[생략가능]) 예) 위의 예제에서 indexOf의 리턴값은 0이다. 주의! 자바스크립트는 0부터 카운트 한다. 그래서 첫자인 A를 찾아 그 인덱스 값인 0을 리턴 하는것이다. 그렇다면 str.indexOf("B");의 리턴값은? 1이다. 이런식으로 0부터 1, 2, 3...으로 올라가는 것이다. A B C C D E ... 0 1 2 3 4 5 ... -----------------------> 그럼 검색을 시작할 인덱스값을 옵션으로.. Programing/JavaScript 2015. 7. 23. 자바스크립트 오브젝트 javaScript object 자바스크립트 오브젝트 javaScript object - 자바스크립트 오브젝트(javaScript object) 우리는 이미 자바스크립트 변수가 데이터 값을 위한 컨테이너 라고 알고 있다. 아래의 코드는 간단한 값을 가진 변수할당 방법이다. var volunteer = "adam"; 오브젝트 역시 변수이다. 그러나 오브젝트는 많은 값을 담을 수 있다. 아래의 코드는 한 변수에 많은 값들을 할당한다. var volunteer = { firstName:"adam", lastName:"lee", age:30, type:"java" }; 그 값은 이름:값의 쌍으로 쓰여진다. (이름과 값은 ':'으로 구분된다.) 자바스크립트 오브젝트는 이름이 있는 값들을 위한 컨테이너다. - 오브젝트 속성(object Prope.. Programing/JavaScript 2015. 7. 19. JavaScript Function 자바스크립트 함수 알짜만 빼먹기 JavaScript Function 자바스크립트 함수 알짜만 빼먹기 javaScript 함수는 특별한 일을 처리하기 위해 디자인된 코드의 블록입니다. 예) function myFunction(p1, p2) { return p1 * p2; // 이 함수는 p1*p2를 리턴하는 함수이다. } - 자바스크립트 함수 문법 자바스크립트 함수는 'function' 키워드, 다음에 이름(name), 다음에 괄호()로 정의됩니다. 함수명은 문자, 숫자, 언더라인(_), 달러표시($)를 포함할 수 있습니다. 괄호 안에는 콤마(,)에 의해 분리된 파라메터명을 포함 할 수 있고(parameter1, parameter2,...) 함수에 의해 실행되는 코드들은 중괄호(curly brackets) 안에 작성됩니다.{} 예) fu.. Programing/JavaScript 2015. 7. 19. 이전 1 2 3 다음 💲 추천 글 반응형