프로그래밍 언어/JavaScript
-
[JS] 문자열 정렬하기, (localeCompare())프로그래밍 언어/JavaScript 2023. 2. 8. 17:12
object에 저장되어 있는 문자들을 영순, 가나다 순으로 정리하려고 한다. 그럴때 짧은 코드로 쉽게 사용할 수 있는 방법이 있다. 📑 localeCompare 이란? 기준 문자열과 비교했을 때 대상 문자열이 정렬상 전에 오는지, 후에 오는지 혹은 같은 순서에 배치되는지를 알려주는 숫자를 리턴한다. 즉 음수, 0, 양수를 반환한다는 의미이다. 아래와 같은 데이터가 있을때 이 title을 기준으로 문자순으로 정렬하려고 한다. export default[{ id : 0, title: "Sinrim station 30 meters away", image: "https://codingapple1.github.io/vue/room0.jpg", content: "18년 신축공사한 남향 원룸 ☀️, 공기청정기 제공"..
-
[JavaScript] ES6, 변수 총 정리 ( var, let, const)프로그래밍 언어/JavaScript 2023. 1. 15. 17:40
ES6 문법에선 변수 선언 방법이 3가지가 있다. var, let, const 라는 3가지 인데 각각 쓰임과 특징이 다르다. 그 특징을 정리해보려고 한다. 1. 선언 2. 할당 3. 범위 📑 1. 선언 var는 재선언이 가능하다. let과 const는 재선언이 불가능하다. 즉) 이미 있는 변수명을 또 다시 선언하려고 하면 에러가 나는 것. var 이름 = 'kim'; //재선언 o, 재할당 o, 범위 function var 이름 = 'park'; //위와 같이 var 이름을 중복해서 재선언이 가능하다. //이처럼 let, const는 재선언이 안 된다. let 나이 = 20; let 나이 = 30; 📑 2. 할당 var과 let은 재할당이 가능하다. 즉) 위에서 선언한 값을 변경하려고 할 때 변경 가능하..
-
[JavaScript] 함수 선언하는 방법 ( 선언식 vs 표현식)프로그래밍 언어/JavaScript 2023. 1. 15. 16:54
자바스크립트에서 함수를 선언하는 방법은 여러가지가 있다. 어떤 방식이 있나 정리해보려 한다. 📑 1. named function declaration (명명 함수 선언) 가장 대중적인 방법으로. 함수의 이름이 hello가 된다. 이 함수는 어느 스코프에서든 호출할 수 있는 함수가 된다. 함수 이름을 생략할 수 없고, 표현식이 아닌 문장이다. function add(x,y) { return x+y; } 📑 2. annoymous function expression (익명 함수 표현) 이름이 없는 함수를 변수에 담는 방식이다. 이름이 없지만, 자바스크립트 엔진이 이름을 변수명으로 추정하여 넣는다 . let funcExpression = function() { return 'woni' ; } funcExpre..
-
[JS] || 기능 살펴보기, 참과 거짓을 판단하는 게 아니다프로그래밍 언어/JavaScript 2022. 12. 15. 08:27
📑 논리연산자 || 다른 언어에서 보통 ||는 &&와 같이 쓰이는 논리연산자이다. 나도 그렇게만 생각하고 있었는데 JS에서 다릏게 쓰이는 걸 봤다. const n1 = 1, n2 = 2; if (n1===1 && n2===2) { console.log("n1은 1이고 n2는 2이다."); } 📑 그렇다면 어떤 기능이? 피연산자 중 하나를 반환한다. 자바스크립트에서 논리 연산자는 단순히 참과 거짓을 판단해주는 연산자가 아니라 연산에 사용된 피 연산자 중 하나를 반환해주는 연산에 불과하다. const n1 = true; 3 || 4 // 3 n1 || 8 // true false || 4 // 4 0 || 9 // 9 ||연산자는 피 연산자로 정수가 오는 경우 Boolean 으로 암묵적 형 변환이 이뤄진다...
-
[JavaScript] for 반복문 사용하는 방법프로그래밍 언어/JavaScript 2022. 11. 27. 15:50
JavaScript에서 반복문을 사용하려면? JAVA랑 차이는 없다. 그래도 예제를 통해 차근차근 정리해보려고 한다. 📑 tab 목록 만들어보기 다음과 같은 HTML 코드가 있다. 이는 3가지 tab을 통해 각각 title을 클릭하면 content를 보여주게 동작하려면? js로 이벤트를 운임해줘야한다. Products Information Shipping 상품설명입니다. Product 스펙설명입니다. Information 배송정보입니다. Shipping contents를 보여주는 것 뿐만이 아니라 어떤 버튼을 클릭했는지 css style의 orange 클래스로 값을 미리 지정해뒀다. 그럼 각각 버튼을 클릭했을 때 현재 버튼 표시와 내용 보여지게하는 건 어떻게 할까??? 📑 js 동작 작성하기 숙련자가 아..
-
[JavaScript] backtick(`) vs single quoto(') 차이프로그래밍 언어/JavaScript 2022. 11. 27. 14:46
📑 들어가기 앞서 강의를 들으며 코드를 따라치고 있는데 작은 따옴표에 태그 입력 후 엔터로 줄바꿈을 하면 에러가 나는 거 아닌가? 엔터를 치지 않는다고 하면 태그 안에 ${} 값들이 그냥 문자열로 인식되었다. 무슨 차이야,, 설정 차인가?? 싶었는데 자세히 보니 따옴표가 다르다! var 템플릿과 var 템플릿22의 감싸진 따옴표를 봐보자. 기울어짐이 다른 걸 확인할 수 있다. 📑 ` 와 ' 살펴보기 명칭을 먼저 알아보면 `는 grave accent라는 것이다. backtick, backquoto라는 이름으로 불려지는데, 한국어로는 억음부호라고 한다. 헷갈리기 너무 쉽죠~ ?위치는 키보드 왼쪽 상단 숫자 옆에 있다. `123456 이런식으로 키보드를 살펴보자. 백틱을 사용한 2번째줄 코드와 작은따옴표를 사..
-
[JavaScript] isNan 함수, 숫자인지 검사하는 함수프로그래밍 언어/JavaScript 2022. 11. 23. 16:07
만약 숫자만 입력해야되는 form에 문자가 들어온다면?? 이를 검증하기 위한 코드가 필요하다. 이럴 때 자주 쓰이는 게 바로 isNan 함수이다. 📑 isNan() isNan( value) 와 같이 사용하며 매개변수가 숫자가 아니면 true, 숫자이면 false를 반환한다. 123.123은 숫자이므로 false를 반환. '123.123'은 따옴표로 감쌌지만, 숫자로 취급하여 false를 반환. 'Not a Number'는 숫자가 아니므로 true를 반환. 123*123은 숫자이므로 false를 반환. '123*123'은 따옴표 안에 문자가 있으므로 숫자가 아닌 것으로 취급하여 true를 반환합니다.