Web Club

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 검색 결과

해당 글 21건

배열 메서드 : every, some 알아보기

every, some 배열 메서드를 활용한 배열 콘텐츠 유효성 검사하기 javascript // 배열이 특정 조건을 만족시키는지 확인하고자 하는 경우에는 Array 객체의 every 메서드를 사용하면 // 모든 원소가 조건을 통과하는지 확인할 수 있습니다. // 예를 들어 다음의 코드는 배열의 모든 원소가 알파벳과 숫자로만 이루어졌는지 확인하는 예제입니다. var arrElement = [123, 'aaa', 'abc', '-', 33, 'DDD']; var arrElement2 = ['aaa', 'abc','DDD']; // 테스트하는 함수 function textValue(el, idx, arr) { var textExp = /^[a-zA-Z]+$/; return textExp.test(el); } ..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2017. 1. 23. 16:58

forEach, map, filter : 각 배열 원소에 함수 적용하기

forEach, map, filter 메서드 forEach 메서드 예제 살펴보기 javascript var charSets = ['ab', 'bb', 'cd', 'ab', 'cc', 'ab', 'dd', 'ab']; function replaceElement(element, idx, arr) { if (element == 'ab') { arr[idx] = '**'; } } charSets.forEach(replaceElement); console.log(charSets); charSets.forEach(function (el, idx, arr) { if (el == '**') { arr[idx] = '***' } }); console.log(charSets); map 메서드 : 배열의 모든 원소에 함수를..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2017. 1. 23. 16:34

insertAdjacentHTML() 메서드

insertAdjacentHTML - HTML 인접(adjacent)요소에 삽입하기 이 메서드를 사용하면 시작 태그의 앞, 시작 태그의 뒤, 종료 태그 앞, 종료 태그 뒤에 노드를 삽입하는 것이 가능합니다. 다음의 코드에서는 insertAdjacentHTML() 메서드를 사용해서 구성한 코드입니다. html how javascript var elm = document.getElementById('elm'); elm.insertAdjacentHTML('beforebegin', 'Hey-'); // 타켓 요소 전(형제레벨)에 생성- 시작 태그의 앞(형제 레벨로) elm.insertAdjacentHTML('afterbegin', 'jaehee-'); // 타켓 요소 다음(자식요소)에 생성 - 시작 태그의 뒤(..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 11. 3. 11:27

for-in 문과 hasOwnProperty()

for-in 루프와 열거for-in 루프는 배열이 아닌 객체를 순회할 때만 사용해야 합니다.for-in 으로 루프를 도는 것을 열거(enumeration)라고도 합니다.자바스크립트에서 배열은 곧 객체이기 때문에 기술적으로는 배열을 순회할 때에도 fon-in 루프를 사용할 수 있지만 권장사항은 아닙니다.배열 객체에 사용자가 정의한 기능이 추가되었다면 논리적인 오류가 발생할 수 있는 여지가 있습니다.또한 for-in 에서는 프로퍼티를 열거하는 순서가 정해져 있지 않습니다.따라서 배열에는 일반적인 for 문을 사용하고 객체에만 for-in 문을 사용하는 것이 바람직합니다. 객체의 프로퍼티 순회하기객체의 프로퍼티를 순회할 때는 프로토타입 체인을 따라 상속되는 프로퍼티들을 걸러내기 위해 hasOwnProperty..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 10. 8. 10:55

arguments 객체

Argument Object 호출하는 함수의 파라미터에 test(5, true,'str')와 같이 세 개의 파라미터를 넘겨주고 호출을 받는 함수의 파라미터에 받는 이름을 작성하지 않더라도 세 개의 파라미터 값을 사용할 수 있다. 이렇게 호출한 함수의 파라미터 값을 호출받은 함수에서 파라미터 값을 저장해 두고 있는데, 호출한 함수의 파라미터 값을 저장해 두는 곳이 arguments 객체이다. 호출받은 함수에서 arguments 객체에 접근하기 위해서는 오브젝트 이름이 필요하며 arguments가 그 이름이다. 즉, arguments 객체에 호출한 함수의 파라미터 값이 순서에 따라 저장되며 호출하는 함수에서 파라미터를 지정하지 않더라도 arguments 객체가 생성되고 파라미터가 없으면 빈 값이 저장되지만 ..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:30

틸트(~) 연산자와 물결물결(~~) 연산자

틸트(~) 연산자 Tilt(틸트) 아래 코드부터 살펴보면 javascript var str = '강남역,잠실역,신논현역'; var val = '남'; if (~str.indexOf(val)) { // 해당 문자열이 있다면 console.log(!~ str.indexOf(val)); // 이코드를 실행하라. } else { console.log(222); } C 언어와 마찬가지로 비트로 부정하는 연산자로 -(n+1) 이런 식이 성립 문자열 메서드인 indexOf() 로 논리식을 짤 수 있음 ~str.indexOf(val) 있다면 -(n+1) 의 값을 반환하고 없다면 0을 반환한다 javascript var val2 = '시'; if (!~str.indexOf(val2)) { // val2가 없다면 cons..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:30

배열 메서드 join()

join method 배열 메서드인 join 메서드에 대해 알아봅니다. Array.join() join 메서드는 배열의 원소를 결합해서 하나의 문자열로 만듭니다. Syntax JavaScript array.join(separator); 인자(Parameters) 인자명 데이터형 필수/옵션 설명 separator string 필수 배열의 원소를 하나의 문자열로 결합할 때 원소와 원소 사이에 위치할 문자열 반환값(Return) string 설명(Description) 첫번째 인자(separator)로 배열의 원소를 결합해서 하나의 문자열을 만듭니다. string.split와 반대되는 기능입니다. 예제 코드 JavaScript var a = new Array("welcome","coding","everybod..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:29

sort 메소드 알아보기

sort 메소드 sort 메소드는 배열을 정렬한다. 알파벳 순서로 정렬하고 숫자의 경우 묵시적으로 문자열로 형변환 하기 때문에 숫자 1이 숫자 10보다 먼저 나온다(예제 참고) 문법(Syntax) / 인자(Parameters), 반환값(Return) array.sort(sortfunc); 인자명 데이터형 필수/옵션 반환값(return) 내용 sortFunc function 옵션 정렬된 배열, 자기자신에 대한 레퍼런스 값 원소들 간에 무엇이 우선인지를 판단한다 var numbers = [9,8,7,6,5,4,3,2,1]; console.log(numbers.sort()); // array, [1,2,3,4,5,6,7,8,9] console.log(numbers); // array, [1,2,3,4,5,6,..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:28

Array.splice 메서드

배열 메서드 splice() Array 객체의 splice 메소드에 대해 알아봅니다. splicesplice 배열 데이터를 원하는 만큼 삭제할 수 있습니다. 기본 => splice(start, length) 즉, (해당인덱스부터, 삭제할 개수) 세번째 매개변수부터는 배열에 데이터를 삽입할 수 있습니다. 항상 원래 배열에서 삭제한 데이터의 배열을 반환합니다. 삭제한 것이 없다면 빈 배열을 반환합니다. 요약 배열의 특정구간을 추출하거나, 특정구간에 특정 배열을 추가합니다. 문법(Syntax) JavaScript array.splice(index, howmany, element1, ...., elementN); 인자(Parameters) 인자명 데이터형 필수/옵션 설명 index number 필수 배열에 추가..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:28

Array.slice() - slice 메소드

배열 메서드 - slice 배열 메서드 중에 slice 메서드에 대해 알아봅니다. slice() Array.slice() 메서드는 배열의 일부분(slice) 혹은 부분 배열(subarray)을 반환합니다. slice() 메서드는 전달 인자를 두 개 받는데, 각 인자는 반환될 부분의 처음과 끝을 각각 명시합니다. 반환되는 배열은 첫 번째 전달인자가 지정하는 위치부터 두 번째 전달인자가 지정하는 위치를 제외한 그 사이의 모든 원소를 포함합니다. 만약 전달 인자를 하나만 명시하면, 그 위치에서 배열 끝까지의 모든 원소를 포함하는 부분 배열을 반환합니다. 만약 전달 인자가 음수라면 배열의 마지막 원소에서 상대적인 위치로 배열 원소를 지정합니다. 예를 들어, 전달 인자 -1은 배열의 마지막 원소를 가리키며, 전달..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:28

Array 객체와 String 객체의 slice 메소드

slice 메소드 배열객체와 문자열객체에는 slice 메소드를 공용으로 사용할 수가 있습니다. slice메소드에 대해 간단히 알아보겠습니다. 1. slice(start, end) - 기본적으로 start(가져올 시작 인덱스) end( 가져올 마지막인덱스 바로 전까지) 2. slice 배열에 포함된 데이터일부를 가진 새배열을 만든다. 다음의 코드를 살펴보겠습니다. JavaScript var arr = ['사당.','교대.','방배.','강남.']; // 매개변수 두개 받을경우 원래 배열에서 가져올 데이터 범위의 시작과 끝을 나타낸다. var result = arr.slice(2,3); // 첫번째 매개변수 인덱스부터 두번째 매개변수 인덱스의 바로 앞까지를 가져온다 // 단, 원래배열은 전혀 건드리지 않는다..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:27

Array 객체의 메소드

Array 주요 멤버 메소드 내용 join([str]) 배열에 들어 있는 값을 모두 붙여서 하나의 문자열로 반환 ex) test.join() // 결과 "test1,test2,test3" sort(function) 배열값들을 매개변수(값을 비교하는 함수)를 이용하여 정렬 파라미터인 function은 선택사항(필수아님) reverse() 배열의 순서를 정반대로 바꾼다 concat(array) 두개의 배열을 합해 하나의 배열로 반환(1차원 배열로 반환) push() 배열의 마지막에 새로운 원소를 추가(반환 값은 추가한 후의 lengh) pop() 배열의 마지막의 원소를 추출(가장 최근에 push()한 것을 추출) 반환값은 삭제한 배열의 원소(엘리먼트), pop의 파라미터는 사용하지 않음 다음의 코드를 통해 ..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 9. 29. 13:27

프로퍼티(Property)와 가비지 컬렉션(Garbage Collection)

프로퍼티(Property) 자바스크립트에서 변수는 기본적으로 객체 프로퍼티(property)와 같습니다. 다시 말해, 자바스크립트 변수는 객체의 프로퍼티라고 볼 수 있습니다. 전역 객체와 전역 변수 자바스크립트 인터프리터가 실행됐을 때 가장 먼저 하는 일은 전역 객체를 생성하는 것입니다. 전역 객체의 프로퍼티는 전역 변수인데, 전역 자바스크립트 변수를 선언할 경우 실질적으로 전역 객체의 프로퍼티를 정의하는 셈입니다. 자바스크립트에서 Window 객체는 브라우저 창에 담긴 모든 자바스크립트 코드를 위한 전역 객체의 역할을 합니다. 이 전역 Window 객체에는 전역 객체를 참조할 때 this 대신 사용할 수 있는 참조(self-referential) window 프로퍼티가 포함되어 있습니다. Window ..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 5. 23. 08:33

form event(폼 이벤트 타입) & 문서로딩

폼 이벤트 타입 및 문서로딩 폼과 관련된 이벤트 타입과 문서로딩에 대해 알아봅니다. submit submit은 폼의 정보를 서버로 전송하는 명령인 submit 시에 발생합니다. form 태그에 적용됩니다. 아래 예제는 전송 전에 텍스트 필드에 값이 입력 되었는지를 확인하고, 만약 값이 입력되지 않았다면 전송을 중단합니다. html name change change는 폼 컨트롤의 값이 변경 되었을 때 발생하는 이벤트입니다. input(text,radio,checkbox), textarea, select 태그에 적용됩니다. html blur, focus focus는 엘리먼트에 포커스가 생겼을 때, blur은 포커스가 사라졌을 때 발생하는 이벤트입니다. 다음의 태그를 제외한 모든 태그에서 발생합니다. , , ..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 3. 8. 07:00

String.concat() & Array.concat()

문자열 객체와 배열 객체의 concat 메서드 String 클래스와 Array 클래스의 메서드인 concat 메서드에 대해 알아봅니다. String.concat() 문자열과 문자열을 합친 값을 리턴한다 Syntax JavaScript string1.concat(string2, string3[,..., stringN]) 인자(Parameters) string2....stringN - 필수, string1과 합칠 문자열들 설명(Description) string1과 stingN을 합친 값을 리턴한다. 문자열들 값은 변경되지 않는다. concatenation(접합)의 줄임말 예제 코드 JavaScript var s1 = "javaScript"; var s2 = "-"; var s3 = "자바스크립트로 배우는 ..

JavaScript/연산자ㆍ메서드ㆍ프로퍼티 2016. 2. 24. 07:00