2021년 4월 10일 TIL (JS/Node 복습, coplit 깊은 탐구)

 

• [JS/Node 기초] Checkpoint 복습
• Sprint Review[JS/Node]를 통한 이해도 체크 후 부족한 부분 학습
• Coplit 깊은 탐구(+ reference의 코드분석) 오류부터 해결까지 전 과정을 나타내었다.
• Vanilla Javascript Effect 무작정 따라하기(Typing Effect) ~ 2021년 4월 11일 : 따로 글을 하나 작성할 것이다.

 

 

[JS/Node 기초] Checkpoint 복습

 

1. let myName = 'Park';

 let이라는 키워드를 통해 myName이라는 변수를 선언하였고, 선언한 변수에 'Park'이라는 문자열 타입의 데이터를 할당했다.

 

2. 올바른 변수 선언 방식

 let myName = 'Park';

 let favoriteNum = 3;

//변수를 선언, 할당 할 때마다 let키워드를 쓰는 방식( 할당 후 끝에는 ;로 마무리)



 let myName = 'Park',

 favoriteNum = 3;

//쉼표를 활용하여 let키워드를 한번만 사용하는 방식(마지막에 ;를 넣어줌)

 

3. 임의의 값을 입력받아 수(number)를 리턴하는 코드

//문제에서 제공한 답과 해설

//parseFloat()은 실수가 될 수 있는 값을 모두 실수로 변환해주는 함수.(+ parseInt를 구글링해보라)
//Number()은 숫자로 평가될 수 있는 모든 값을 모두 숫자로 바꾸어 리턴,
//숫자로 평가될 수 없는 값이 할당된 경우 NaN을 리턴


function convertToNumber(anything){
	return parseFloat(anything);
}

function convertToNumber(anything){
	return Number(anything);
}


//구글링(how to convert number in javascript)

//Converting strings to numbers with vanilla JavaScript
//parseInt() # The parseInt() method converts a string into an integer (a whole number). It accepts two arguments. ...
//parseFloat() # The parseFloat() method converts a string into a point number (a number with decimal points). ...
//Number() # The Number() method converts a string to a number.

 

 

4. 임의의 두 값을 입력받아 그 값들의 곱을 변수에 담아 변수를 리턴하는 코드 작성

function(num1, num2){
	let mulNums = num1 * num2;
    return mulNums;
}

 

5. String Method를 통해 문자열을 handle하기

let myName = 'Park';

//변수 뒤에 [index]로 해당 string의 index에 해당하는 문자를 불러올 수 있다.  
myName[0]
"P"
myName[3]
"k"
myName.charAt(0)
"P"
myName.charAt(3)
"k"

//+로 문자열과 문자열을 합칠 수 있다.
myName + ' Daniel'
"Park Daniel"

//.indexOf('찾고자하는 문자')를 입력하면 해당 문자가 있는 index를 반환하며 없을 경우 -1을 반환
myName.indexOf('P')
0
myName.indexOf('k')
3
myName.indexOf('o')
-1

//.includes('존재를 확인하고 싶은 문자')로 해당문자가 변수에 있으면 true를 없으면 false를 반환한다. 
myName.includes('P')
true
myName.includes('o')
false

//.split('seperator')로 seperator를 기준으로 끊은 배열을 return할 수 있다.

let fullName = 'Park Daniel';
fullName.split(' ');
(2) ["Park", "Daniel"]

fullName.split('');
(11) ["P", "a", "r", "k", " ", "D", "a", "n", "i", "e", "l"]

//.slice(start, end), .substring(start, end)로 해당 문자열의 start부터 end-1까지의 string을 반환한다.
fullName.slice(0,3)
"Par"
fullName.substring(0,3)
"Par"
//index 2까지의 값을 반환하는 것을 알 수 있다.

 

6. 문자열을 인자로 받아 특수문자를 붙여서 리턴하는 함수만들고 인자에 what is this를 넣은 함수를 호출 후 그 결과값을 변수 result에 할당하라

function returnStringWithMark(word){
	if(typeof word !== "string"){
    return 'Do it in another way.'
    }else{
    return word + '?';
    }
}

let result = returnStringWithMark('What is this');

result
"What is this?"

 

7. 조건문 작성의 유의사항

 두 조건이 겹치는 경우는 따로 분리해서 두조건이 모두 참일때에만 조건문이 작동할 수 있도록 조건문을 작성해야한다. 단, 두 조건이 모두 참일때에만 작동하는 조건문의 결과값의 도출을 위해서는 각각의 두 조건보다 위에 두어 작동할 수 있게끔 코드를 짜야한다. 

 

 

Sprint Review[JS/Node]를 통한 이해도 체크 후 부족한 부분 학습

 

5. for문과 while문에 대해서 설명할 수 있는가?

 

 우선 for문 과 while문의 사용방법을 보겠다.

//for문

for(let n = 0; n < 4; n++){
	console.log('Hello Park');
}

//while문

let n=0;
while(n < 4){
	console.log('Hello Park');
    n++;
}

 우선 for문의 경우()안에 초기화, 조건식, 증감문이 들어가 있고, while의 경우 초기화와 증감문을 따로 넣고 조건식만 ()안에 넣어준다.

언제, 왜 while문을 사용하느냐? 초기화와 증감문이 필요없는 경우에 사용.

 

 

Coplit 깊은 탐구(+ reference의 코드분석)

reference를 ctrl + c, ctrl + v하지 않겠다. 오류까지 다 적어보겠다.

17_isPrime(반복문)

//기존 본인의 코드이다.

function isPrime(num) {
  let neuArr = []; 
  for(let i = 1; i <= num; i++){
    if(num % i === 0){
      neuArr.push(i);
      }
  }if(neuArr.length === 2){
    return true
  }else{
    return false
  }
}
//소수는 1과 해당 숫자로만 나누어지는 수라는 것을 이용하는 것.
//반복문을 사용하여 해당 숫자를 1부터 해당숫자까지 나누어서 나누어지는 수를 모두 빈배열에 넣는 것이다.
//반복문이 다 돌고 난 뒤에 배열의 length를 내려서 그 수가 2일때 소수라고 판단하는 형식이다. 



//sprint리뷰를 통해 알게 된 수도코드에 적용해 보겠다.
let result = true;
let sqrt = parseInt(Math.sqrt(num));

function isPrime(num) {
  // 2인 경우 -> 소수 맞음 true
	if(num === 2){
    return result;
    }
  // 소수가 아닌 경우? 짝수인 경우 -> 소수 아님 false
    if(num % 2 === 0){
    	return !result;
    	}
  // 3부터 자기 자신(num) 전 까지 for문으로 반복해서 나누어 떨어지는 경우가 있으면 소수가 아님 false
  	for(let i = 3; i < sqrt; i = i + 2){
    	if(sqrt % i === 0){
        	return !result;
        }
    }
  // 나머지는 다 소수니까 true 리턴
  	return result;
  }
  
VM189:2 Uncaught ReferenceError: num is not defined
    at <anonymous>:2:31  

//무엇지 문제인지 해석해 보았다. num이 정의되어있지 않다란다. 
//아하 살펴보니 sqrt변수를 선언했을때 num이 무엇인지 알 방법이 없다.
//그렇다면 sqrt 변수를 function의 바디안에다가 넣어보자. num이 매개변수로 나왔으니 이제는 될것이다.

let result = true;

function isPrime(num) {
    let sqrt = parseInt(Math.sqrt(num));
  // 2인 경우 -> 소수 맞음 true
	if(num === 2){
    return result;
    }
  // 소수가 아닌 경우? 짝수인 경우 -> 소수 아님 false
    if(num % 2 === 0){
    	return !result;
    	}
  // 3부터 자기 자신(num) 전 까지 for문으로 반복해서 나누어 떨어지는 경우가 있으면 소수가 아님 false
  	for(let i = 3; i < sqrt; i = i + 2){
    	if(sqrt % i === 0){
        	return !result;
        }
    }
  // 나머지는 다 소수니까 true 리턴
  	return result;
  }
undefined

//예상과 일치했다. 과연 시뻘건 에러를 출력하지는 않은듯. 함수를 호출해 보자.
  
isPrime(2)
true
isPrime(4)
false
isPrime(6)
false
isPrime(17)
true

isPrime(97)
false


//오 잘 작동한다 싶었는데 97을 넣은경우 true를 리턴해야 하는데,
//반대 불린값을 출력한다. 뭐가 잘못됬을까?
//아 찾아보니 

  	for(let i = 3; i < sqrt; i = i + 2){
    	if(sqrt % i === 0){
        	return !result;
        }
    }

//위 코드의 for문의 ()안에 조건식을 <=으로, if문 ()안에 sqrt가 num으로 바뀌어야 된다. 
//이 부분을 설명하려면 왜 num에다가 Math.sqrt를 해야했는지 설명이 필요할 것이다. 
//제곱근을 만든 이유는 무엇인가? 그리고 그것을 반복문의 조건식에 넣은 이유는? 

//3부터 자기 자신(num) 전 까지 for문으로 반복해서 나누어 떨어지는 경우가 있으면 소수가 아님

//위 조건에서 유추해 볼 수 있다. num이 9일때 Math.sqrt를 돌리면 3이 출력된다. 이는 무엇을 의미할까
//제곱근으로 num을 나누었을때 나머지가 0이라는 것은 그 수는 벌써 소수가 아닌 것이다.
//소수는 num을 1과 num자신으로 나누었을 때 0이되는 수이기 떄문이다.
//따라서 i를 sqrt이하(같은 것을 반드시 포함해야한다.)로 조건식에 넣어줘야하고 num을 sqrt로 나누어야
//소수를 판단할 수 있을 것이다. 자 수정해보자. 

function isPrime(num) {
	let result = true;
    let sqrt = parseInt(Math.sqrt(num));
  // 2인 경우 -> 소수 맞음 true
	if(num === 2){
    return result;
    }
  // 소수가 아닌 경우? 짝수인 경우 -> 소수 아님 false
    if(num % 2 === 0){
    	return !result;
    	}
  // 3부터 자기 자신(num) 전 까지 for문으로 반복해서 나누어 떨어지는 경우가 있으면 소수가 아님 false
  	for(let i = 3; i <= sqrt; i = i + 2){
    	if(num % i === 0){
        	return !result;
        }
    }
  // 나머지는 다 소수니까 true 리턴
  	return result;
  }
  
  //모든 케이스를 통과하였다! 하지만 여기서 번뜩이는 생각이 들었으니 
  //이때까지 케이스로 봤던 소수를 Math.sqrt하면 정수가 아니었다.
  
  //그렇다면 위 조건을 Math.sqrt(num)이 parseInt(Math.sqrt(num))과 같다면 
  //false를 리턴하는 것으로 반복문을 안쓰고 같은 결과를 가져올 수 있지 않을까?
  
  function isPrime(num) {
	let result = true;
    let sqrt = parseInt(Math.sqrt(num));
 
	if(num === 2){
	    return result;
    }

    if(num % 2 === 0){
    	return !result;
    	}
 
    if(Math.sqrt(num) === sqrt){
        return !result;
        }
 
  	return result;
  }
  
  //결과는 실패다. 왜냐하면 일단 12887을 넣었을때 false를 출력해야하는데 true를 반환하기 때문이다.
  //이유는 무엇이냐하면 12887은 나누었을 때 나머지가 0인 숫자들이 꽤 있기 때문이다.
  //[1, 7, 49, 263, 1841, 12887] 1과 12887을 제외하고도 4개나 더 있다.
  
  이로써 큰 교훈을 얻었다. 어떠한 수 num을 Math.sqrt(num)한 값이 정수가 아니라고해서 소수인 것은 아니다.ㅠㅠ

 

 

Vanilla Javascript Effect 무작정 따라하기(Typing Effect) ~ 2021년 4월 11일 : 따로 글을 하나 작성할 것이다.