본문 바로가기

FrontEnd19

[JS] Javascript의 함수(Function) * Template literals : 문자열을 보다 편리하게 사용할 수 있도록 템플릿을 제공해준다. - 사용법 : `(백틱) 을 사용해 문자열을 감싸준다. ex. `str` 1) 여러줄의 문자열을 편리하게 사용하기 위해 사용한다, 템플릿 리터럴을 사용하지 않으면 라인피트를 사용해 줄바꿈 처리를 해주고 문자열 결합 연산자도 신경을 써야 하지만 template literals를 사용하면 그럴 필요가 없다. 2) ${}을 사용하기 let strVal = 'template literals'; console.log( "이전 : " + strVal + "라는 것이다."); console.log( `이후 : 이건 ${strVal} 라는 것이다.`); --> 더 깔끔하게 표현가능 ! Function : 자바스크립트에.. 2021. 1. 21.
[JS] Javascript의 배열(array) 배열 : 배열은 자바스크립트에서 모든 타입의 변수를 보관하는 자료구조로 자바의 List와 유사하다. 배열 객체의 메서드 (1) indexOf() : 배열에서 요소가 위치한 인덱스를 반환하는 메소드 : #search의 value값과 동일한 요소가 배열에 있는지 파악한 뒤 그 인덱스 값을 반환, 이 후 반환된 인덱스 값이 0이상일 경우 결과값에 해당하는 문자열을 출력한다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 확인하기 function testIndexOf(){ let indexOfNote = document.querySelector('#indexof-note'); let keyword = document.querySelector('#search'); le.. 2021. 1. 19.
[JS] Javascript의 statement if : 자바의 if문과 동일하게 적용 if문의 값이 true이면 innerHTML을 이용해 해당 문자열을 출력하는 형태이 코드이다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 function testIf(){ let input = document.querySelector('#if').value; let ifNote = document.querySelector('#if-note'); if(input == 1){ ifNote.innerHTML += '1을 입력하였습니다. '; }else if(input == 2){ ifNote.innerHTML += '2를 입력하였습니다. '; }else{ ifNote.innerHTML += '1또는 2를 입력하세요. '; } } Color.. 2021. 1. 19.
[JS] Javascript 의 연산자(operator) 연산자의 종류 산술 연산자 : + - / % 단항 연산자 : ++ -- 비교 연산자 : > = 숫자로 처리하다가 마지막 문자열 등장, 이후 결합(=147) let case2 = 7 + '7' + 7; -> 숫자로 처리하다가 중간에 문자열 등장, 이후 결합(=777) let case3 = '7' + 7 + 7; -> 맨 처음 문자열이 등장해서 아예 문자열로 결합(=777) let case4 = (7 + 7) + '7'; -> 괄호 안의 숫자 연산 후 문자열 결합(=147) let case5 = '7' + (7 + 7); -> 괄호 안의 숫자 연산 후 문자열 결합(=714) equal ==(동등연산자 ): 값만 비교 ===(일치연산자) : 값과 타입을 모두 비교 2021. 1. 19.