Codecamp_21일차

김영탁·2021년 11월 29일
0

어느덧 이곳에 온지도 5주차가 되었다.
아무것도 모르는놈이 여기에서 몇주 하더니만 그래도 제법 알아듣기는 하는것같다.

오늘은 21일차 수업내용을 적어보려고 한다.

오늘의 주제
1. props, data, perv, graphql-variables
2. 정규표현식
3. global state

1. props, data, perv, graphql-variables

위의 녀석들은 각각의 기능을 하는 놈들이라고 알고 있었다,
허나 오늘 배운 내용을 토대로 재해석 하자만 그냥 이름일 뿐이었다
그 이름을 매개변수명이라 하는데 꼭 저 이름이 아니어도 된다는 것이다.

그래서 나는 그런생각이 들었다. "그러면 다 같은 단어를 써서 햇갈리게 하는것보다
각각의 사용되는 기능에 맞게 설정하면 보기 쉽겠지?"
응~ 아니야~ 저 이름은 현업에서도 많이 사용되는 이름이라고 한다
그럼 대체 왜? 음.. 관례라고 한다.. 그래.. 관례는 따라야지..

아무튼 1번 주제는 저 친구들의 정의되어 있는 기능이 아니라 각 매개변수의 이름이라는거~

2. 정규표현식

두번째 주제는 정규표현식이다, 오늘은 간단한 예제를 가지고 배웠는데
회원가입을 할때 이메일이나 전화번호를 검증하는 그런 예제이다.

위의 내용이다.

첫번째 사진은 전화번호를 검증하는 부분이 되는데
전화번호의 자릿수를 통해 검증을 하게 되는것이다.
.test라는 기능을 이용하게 되는데 첫번째 줄의 내용처럼 기입할경우
010-1234-5678이 아닌 010-1234-5679를 넣는다면 false로 반환하게 된다.
그럼 전국민이 1234-5678이라는 전화번호를 쓰는게 아니니까 당연히 안되겠지?
그래서 다음 방법을 사용했다.
두번째 줄 처럼 \d이라는 값을 주는것인데 저렇게 하면 문자열이 한개 또는 그 이상의 조건을 가지는것을 뜻하게 된다.
우리나라는 맨 앞의 자릿수를 세자리로 이용하기 때문에 {3}을 이용해 세자리로 값을 주었고
그 뒤에는 그에 맞는 값을 설정해주었다.

아니 근데 이게 뭐람.. 1231231010-5555-123123128938 라는 번호를 true????
그렇다 저렇게 \d{3}-\d{3,4}-\d{4}라고 값을주면 그냥 저 문자열이 조건에맞는 부분이 있기만 하면 다 true인것이다.

그래서 우리는 또 하나의 조건을 준다,
시작점과 끝점을 지정해주는 것이다.

그리하여 완성된 코드는 /^\d{3}-\d{3,4}-\d{4}&/ 이다.
이렇게 하니까 정상적으로 유효성 검사를 하였다.
크~ 드디어 해결!

여기서 사용된 표현식
\d : 숫자열이 1글자 이상
\w : 문자열 1글자 이상
^ : 문자열의 시작점
$ : 문자열의 끝점

3. global state

마지막으로 global state에 대해 알아보자!

이 내용인데 흠.. 쉽게 생각하기론 props를 사용하는것 처럼 저 친구도 자손요소에게 넘겨주는 역할을 한다.
props와 다른점이라면 글로벌 스테이트는 부모에게 선언을 하고 자손-자손으로 넘어가는것이 아니라
중간단계를 뛰어넘고 맨 마지막 후손에게까지 갈수 있다는것이다.
내일 또 배운다고 하니까 내일 좀더 자세히 공부해서 적어야겠다.

이상 끝

profile
front-end engineer

0개의 댓글