본문 바로가기
JS

개발일지(2023.05.22)

by 썸맨 2023. 5. 22.

* 배포에러

ImportError: cannot import name DEFAULT_CIPHERS

=> AWS 배포 문제로 해결이 되지 않아 튜터님에게 문의, 갑자기 eb를 찾지 못한다는 오류 발생, 명령 프롬포트와 vs code에pip install --upgrade urllib3 --userpython -m pip install --upgrade urllib3 --user 설치를 해도 먹히지 않아 windows poweshell 에서 설치, 설치가 되었는데도 vs code에서는 eb를 여전히 찾을수 없었음

=> 그러던 중 두 세번 vs code를 재접속 하니 갑자기 eb init 찾을 수없음에서 기존에 나오던 오류 ImportError: cannot import name 'DEFAULT_CIPHERS' from 'urllib3.util.ssl_' (c:\homepage\venv\lib\site-packages\urllib3\util\ssl_.py) 발생!

=> github에서 23년도면 pip install 'urllib3<2' 설치 답변을 받아 설치 후 재부팅하니까 eb init 명령어 작동, 정상적으로 보안 자격증명 후 배포 했는데 Pending상태에서 Severe로 오류 발생해서 배포 실패(추가 구글링 예정)

 

*JS 1주차(개념)

  • JS: 1995년 라이브스크립트로 제작 후 이름 변경, 브라우저 동작 스크립트 언어, 2005년에 AJAX의 등장으로 UX가 폭발적으로 향상(이전 웹사이트는 버튼을 누르면 무조건 새로고침 -> 해당 부분만 새로고침 되도록), 2008년에 V8엔진 출시(구글), 2009년에 Node.js등장(브라우저를 깨고 어디서든 사용이 가능)
  • JS 특징 : 객체 지향 프로그래밍(재활용성), 동적 타이핑 언어( JS는 타입을 지정하지 않고 런타임에서 타입이 결정됨), 함수형 프로그래밍 지원, 비동기 처리, Client/Server 측 모두 사용 가능
  • node 파일명.js : JS실행, clear: 터미널 화면 초기화, // 주석
  • 변수 : 기억하고 싶은 값을 메모리에 저장을 한 후 읽어들여 재사용함
  • 변수 개념 : 변수 이름(한글 가능하긴함), 변수 값, 변수 할당(변수에 저장), 변수 선언(사용하기 위해 컴퓨터에게 알림), 변수 참조(할당된 값을 읽어오는 것), 선언 후 나중에 할당 가능 (var, let, const)
  • let / const : ES6문법 등장으로 let은 var의 호이스팅 개념으로 인해 발생하는 문제 등을 보완하기 위해 등장(일반적 개념은 동일, const는 상수-재 할당x)
  • 데이터 타입(type of 변수명) : 코드 실행 시, 즉 런타임에 결정
  • 1. 숫자 타입(number) : 정수, 실수, 지수(ex) 2.5e3 = 2.5*10^3), NaN(Not a Number), Infinity(ex) 0으로 나누면 무한대로 치솟음), -Infinity(음수를 0으로 나눌 때)
  • 2. 문자 타입(String, ' '/" "로 감싸야 함) 기능 : str.length(해당 문자열의 길이 출력), str1.concat(str2)(str1에 str2를 붙임), str.substr(i, j)(i위치부터 j개까지 문자열을 자름),  str.substring(i, j)(i부터 j-1위치까지 문자열을 반환), str.slice(i, j)  (i부터 j-1까지의 문자열을 반환), str.search()(해당 문자열이 시작하는 지점을 숫자로 출력), str.replace(str_1, str_2)(해당 문자열의 str_1 부분을 str_2로 바꿈, str.split(기준 문자열)(기준문자열을 기준으로 분할해 배열로 저장함)
  • 3. Boolean 타입(True / False)  4.undefined : 정의되지 않음(값이 할당 x)  5. null : 값이 존재 하지 않음을 명시적으로 나타냄 ->개발자가 변수에 값이 없다라는 걸 표현하기 위해 의도적으로 사용(undefined와 전혀 다름!)
  • 6.  Object(객체) 타입 : key-value pair {key값 : value값}  7. Array 타입 : 여러개의 데이터를 순서대로 저장 
  • 형 변환 : 명시적 형 변환(일부러 변환) / 암시적 형 변환(의도하지 않았는데 자동으로 바꿈)
  • 암시적 형 변환(+) : +가 나오면 문자열로 형변환이 우선시 됨(1+"2"=12(string) 같이 변환, but!) 숫자+true만 숫자+1로 출력(true는 1로 인식하기에))
  • 암시적 형 변환(-, *, /) : 나머지 이 세개의 연산자는 숫자가 우선시 됨(ex) 1-"2"= -1, "2"*"4" = 8(number))
  • 명시적 형 변환 : 불린타입(Boolean(값)-> Boolean(0, ""(빈문자열), null, undefined, NaN : false / 1, "문자열", {}(빈 객체) : true 반환), 문자열 형 변환(String(값)), Number 형 변환(Number("123"))
  • 연산자 : 비교 연산자( ===, !== (타입까지 일치해야 true/false반환)), 삼항 연산자(condition? result1 : result2 => condition이 true면 result1이 반환, false면 result2가 반환), 타입연산자(typeof)
  • 스코프 : 범위, 변수의 영향 범위(전역변수- 전체에 영향/지역변수- 함수내부 선언)
  • Arrow Function : ES6문법 등장으로 기존 함수 선언문을 좀 더 간편하게 제시 ex) let arrowFunc01 : (x, y) => { return x+y}; let arrowFunc02 : (x, y) => x+y; => 한 줄로 표현이 가능!(함수 내부 실행 로직이 한 줄 일 경우만 가능) , let arrowFunc03 = x => x; (= function arrowFun03 (x) { return x;} 와 동일 / 매개변수도 하나면 ()생략이 가능)
  • 조건문 : switch(변수 값에 따라 여러 개의 경우 중 하나를 선택 - ex) let fruit = '사과'; switch(fruit) { case '사과' : console.log('사과입니다'); break; case '바나나' : console.log('바나나'); break; default('x'): break; } )
  • let x =10; (x>0) && console.log('x는 양수') (&&조건 때문에 가능 ( = if(x>0) { console.log('x는 양수')}) )
  • let y; let z = y || 20; =>y에 값이 없다면 z에 20을 대입(따라서 z=20, but y는 그대로 undefined이다!!)
  • truthy / falsy : 조건으로 사용될수 있는 값(0, " ", null 등이 false / 1, "문자열" 등이 true로 해석)
  • 객체 : 하나의 변수에 여러 개의 값을 넣을 수 있음(넣는 데이터 타입은 제한이 없음!) ,  기본 생성 형식은 let 객체명 = { name : '박성민, age: 30, gender : '남자' }; / 생성자를 통한 객체 생성은 function Person(name, age, gender) { this.name = name; this.age = age; this.gender = gender; } =>(선언부) let person1 = new Person('박성민', 30, '남자'); (접근 시, person1.name / person1.age로 접근!)
  • 객체 메소드!!(객체가 가진 여러가지 기능) : 1) Object.keys(객체명) - 해당 객체의 키 값들을 출력 2) Object.values(객체명) - 해당 객체의 value 값들을 출력 3) Object.entries(객체명) - key와 value를 묶어 2차원 배열을 만듬 4) Object.assign(객체1, 객체2, {변경 객체key : value}) - 객체 1에 객체 2를 복사함(뒤에 객체의 속성부분이 나온다면 객체2의 해당 key의 value값으로 바꾼 후 객체1에 저장함 // 주의 : 두 개의 객체명을 전부 작성해야 원본이 뮤테이트 되지 않음!!! 5) 객체 비교 - 참조형복사로 만든 객체 아닌 완전 같은 속성의 객체를 비교해도 false가 나옴!(객체는 크기가 상당히 커 별도의 공간에 저장 - 각각 객체는 별도의 공간에 대한 직접적 값이 아닌 저장할 때의 주소를 저장하기에 false) => 객체 안의 내용을 비교하고 싶을 때는 JSON.stringfy(객체1) === JSON.stringfy(객체2) 6) 객체 병합 - spread operator(...)을 이용해 병합 ex) let person = {...person1, ...person2 } //두 내용의 값 병합! ({...객체명} : 해당 객체의 객체 내용 복사)
  • Array 메소드 : .push() - 해당 값을 배열 맨 마지막에 추가, .unshift() - 해당 값을 배열 맨 처음에 추가, .pop() - 해당 배열의 맨 마지막 인덱스 삭제, .shift() - 해당 배열의 맨 처음 인덱스 삭제, .splice(i, j, 값) - 해당 배열의 i위치의 인덱스부터  j개수만큼 삭제하고 그 자리에 값을 넣음, .slice(i, j) - 해당 배열을 i위치값부터 j-1위치까지를 반환해서 넣음
  • 반복문(콜백함수를 받는 메소드) : 1) forEach : 별도의 return이 없고 안에 내용이 실행되게 하는 함수 ex)let numbers = [1, 2, 3, 4, 5]; 1) numbers.forEach(function(item){console.log(item +1)}); => 결과 값으로는 2, 3, 4, 5, 6 (기존 배열은 값이 뮤테이트 되지 않음) 2) map() : 반드시 return 값을 통해 새로운 값을 생성& 항상 원본 배열의 길이 만큼 return이 된다!!! ex) let newNumber = numbers.map(function(item){ return item *2 }); => 2, 4, 6, 8, 10(기존 배열 뮤테이트x)    3) filter() : map과 구조 동일 차이점으로는 조건이 들어가야 함 => return 값이 해당 조건에 맞는 배열만 반환하는 것임 ex) numbers.filter(function(item) { return item === 5}); => 배열에 5인 값만 리턴해라(기존 배열 뮤테이트x)  4) find() : find 조건에 맞는 것 중 맨 앞의 하나의 값만 return ex)let a = numbers.find(function(item) { return item > 3;}); => a 값은 4 (뒤의 값은 가져오지 않음 딱 하나만)

★★ forEach만 별도의 return이 필요없고 나머지 map(), filter(), find()는 모두 return이 필요하고 해당 return을 받을 변수가 필요하다★★

 

* 숙제 1) 문자열 연습하기 : 대소문자 섞여있는 문자열에서 p개수와 y개수를 비교해 같거나 하나도 없을 때는 True , 다르면 False return하는 솔루션 완성하기(개수 비교 시, 대소문자 구별 x)

let s = "ppRElacEmEnTY"
let p_number = 0;
let y_number = 0;
let result = true;
for (a=0; a<s.length; a++) {
    if(s[a] === "p" || s[a] === "P") {
        p_number += 1;
    } else if(s[a] === "y" || s[a] === "Y") {
        y_number += 1;
    }
}
function is_eql(i, j) {
    if(p_number === y_number) {
        return true;
    } else if(p_number !== y_number){
        return false;
    } else {
        return true;
    }
}
result = is_eql(p_number, y_number);
console.log(result)

=> 우선 각 문자열마다 체크해서 p와 y의 개수를 저장하는 변수 만든 후 그 수를 비교해 true, false 반환 함

 

* 숙제 2) 반복문, 조건문 연습 : 정수들의 절대값을 차례로 담은 배열 absolutes와 정수의 부호를 차례로 담은 불리언 배열 signs이 매개변수로 주어짐, 실제 정수들의 합을 구하여 return 하도록 솔루션 완성하기

let absolutes = [-5, 1, -3, 7, -9, 2] //이렇게 해서 절대값으로 만들어도 되고 처음부터 [5, 1, 3, 7, 9, 2]로 설정해도 동일함.
let sign = ['-','+', '-' , '+', '-', '+']
let result = 0
for (i=0; i<absolutes.length; i++) {
    absolutes[i] = Math.abs(absolutes[i])
}
function solution(absolutes, sign) {
    for(i=0; i<absolutes.length; i++) {
        if(sign[i] === '+') {
            result += absolutes[i]
        } else if(sign[i] === '-') {
            result += -absolutes[i]
        }
    }
    return result

}
solution(absolutes, sign);
console.log(result)

※ boolean배열과 절대값만 담은 배열로 문제를 늦게 봐서 다시 풀이 ※

let absolutes = [5, 1, 3, 7, 9, 2] //이렇게 해서 절대값으로 만들어도 되고 처음부터 [5, 1, 3, 7, 9, 2]로 설정해도 동일함.
let sign = [false, true, false, true, false, true]
let result = 0

function solution(absolutes, sign) {
    for(i=0; i<absolutes.length; i++) {
        if(sign[i] === true) {
            result += absolutes[i]
        } else if(sign[i] === false) {
            result -= absolutes[i]
        }
    }
    return result

}
solution(absolutes, sign);
console.log(result)

=> 반복문을 돌려 sign이 false면 빼기, true면 더하기로 해서 합계를 결과로 출력

'JS' 카테고리의 다른 글

JS 메소드  (4) 2023.05.30
JS 5주차 개념 정리  (0) 2023.05.25
JS 4주차 개념 정리  (0) 2023.05.25
JS 3주차 개념 정리  (0) 2023.05.23
개발일지(2023.05.22)  (0) 2023.05.22