[01] 2022.07.18

Rio·2022년 7월 18일
0

React

목록 보기
2/8
post-thumbnail

자바스크립트 입력값 받기

var input = prompt("값을 입력해주세요");

그럼 텍스트필드 영역에 입력한 값을 '문자열'로 가져온다.
입력한 값을 number나 다른 자료형으로 사용한다면 형변환을 해주어야한다.

var input = prompt("값을 입력해주세요");
parseInt(input); //문자열을 정수로 변경
parseFloat(input); //문자열을 실수로 변경
Number(input); //문자타입을 숫자타입으로 변경

그러나 Number(str)과 parseInt(str), parseFloat(str)과는 좀 차이가 있다.

Number(str)

var num = Number('1234'); // 숫자 1234
var num = Number('10.123'); //숫자 10.123
var num = Number('1000원'); // NaN 에러!! 변환안된다.

parseInt(str) / parseFloat(str)

var num = parseInt('1234'); // 1234
var num = parseInt('1000원'); // num에 1000이 저장
var num = parseInt('가격 : 1000원'); // num에 NaN이 저장

문자열의 시작이 숫자로 시작하면 거기까지 숫자를 인식해서 반환해준다 👍🏻

Null / undefined

둘 다 값이 없다는 점은 동일!
변수를 선언만 하고 초기화를 안하거나, 선언조차 안된 변수를 호출할 때undefined 상태가 된다.
Null은 의도적으로 개발자가 값을 넣어놓지 않은, 즉 무의 상태를 표현하기 위해 사용된다.

var _obj; //undefined
var _null_obj = null; //null

문자열

str1.concat("str2");

두 문자열을 연결하는 메소드

var str1 ="Hello";
var str2 ="World";
var str3 = str1.concat(str2); //"Hello World"

str1 + str2;

그냥 문자열을 더하기 연산으로도 연결할 수 있다.
문자열과 숫자를 더할 경우 숫자를 자동으로 문자열로 변경하여 연결한다.

var str1 ="Hello";
var str2 ="World";
var str3 = str1 + str2; //"Hello World"
var str4 = "Pi:" + 3.14 // "Pi:3.14"

charAt(인덱스)

특정 위치의 문자열을 알아내는 메소드

var str = "abcdef";
str.charAt(0); // a
str.charAt(5); // f
str[2]; // c
str.charAt(7); //""

한 가지 특이한 점은 다른 문법에서는 문자열의 범위를 넘어가는 인덱스에 접근하면 OutOfRange 에러를 띄우는데, javascript에서는 빈 값 ""을 반환한다.

부분 문자열 구하기

문자열 중 일부 구간만 필요할 때가 있다.

.substr(pos,length)

  • length 생략 시, pos에서 맨 마지막까지 반환
  • pos가 음수인 경우, 문자열 길이 - pos로 동작 = 즉 뒤 쪽부터
var str = "abcdef";
str.substring(2,4); //"cde"

.substring(pos1, pos2)

  • pos1에서 pos2 문자열 추출
  • pos2 생략시 맨 마지막까지 추출

문자열 검색하기

  • indexOf(str) : str이 있으면 첫 시작 위치 인덱스 반환
  • lastIndexOf(str) : 여러번 발생한 경우, 마지막 문자의 시작 인덱스 반환

    문자열이 없으면 -1을 반환

var str = "abcdab";
str.indexOf("ab"); // 0
str.lastIndexOf("ab"); // 4
str.indexOf("f"); // -1

배열 요소 추가/삭제하기

배열의 앞과 뒤에서 엘리먼트를 추가하거나 삭제가 가능하다

  • .push(element) : 배열의 뒤에 요소 추가
  • .pop() : 배열의 뒤에서 요소 삭제하고 리턴
  • .shift() : 배열의 앞에서 요소 삭제하고 리턴
  • .unshift(element) : 배열의 앞에 요소 추가
var arr = [1,2,3,4,5];
arr.push(6); // arr = [1,2,3,4,5,6];
arr.pop(); // arr = [1,2,3,4,5]; 이 되고 6을 반환
arr.shift(); // arr = [2,3,4,5]; 이 되고 1을 반환
arr.unshift(7); // arr = [7,2,3,4,5]; 

배열 붙이기, 검색하기

  • ary1.concat(ary2) : ary1과 ary2를 붙임
  • ary.indexOf(element) : ary에서 element가 있는 첫 위치를 검색
  • ary.lastIndexOf(element) : ary에서 element가 있는 마지막 위치르 반환

for in / for of

둘 다 객체의 요소들을 자동으로 순차 접근하게 해주는 기능이다.

var obj = {
    name: "object",
    age: 10,
    weight: 5
}
for(var v in obj){
	console.log(v); // name, age, weight
  	console.log(obj[v]); //"object", 10, 5
}
profile
우당탕탕 개발 기록지

0개의 댓글