🚩 javascript module

module

📝 설명

• 모듈이란 .js 파일 하나를 가리킨다.
• export와 import를 사용하여 외부 모듈을 가져올 수 있다.

✒️ 사용법

입력

counter.js

export let count = 0;

export function increase() {
  count++;
  console.log(count);
}
// 외부로 노출시킬 부분만 export 해줌
// export default로 설정되어 있을 때는 내 맘대로 함수 이름 지정 가능
// default 없이 그냥 export일 경우에는 중괄호 안에 함수명을 넣어서 사용 (함수 이름 지정 불가)

// count를 리턴해주는 함수
export function getCount() {
  return count;
}

main.js

// import hi from "./counter.js";
// hi();
// counter.js 파일에서 export하는 코드가 export default로 설정되어 있을 때는 내 맘대로 함수 이름 지정 가능

// import { increase } from "./counter.js";
// increase();
// default 없이 그냥 export일 경우에는 중괄호 안에 함수명을 넣어서 사용 (함수 이름 지정 불가)

// import { increase as abc, getCount } from "./counter.js";
// 원하는 이름으로 받아오고 싶을 때 as 사용
// abc();
// abc();
// console.log("count는? : ", getCount());
// abc();

/*
import { increase, getCount } from "./counter.js";

increase();
increase();
increase();
const count = getCount();
console.log("getCount함수", count);
*/

import * as cc from "./counter.js";
// counter.js 안의 모든 export 해주는 요소들을 cc라는 이름으로 가져옴
cc.increase();
cc.increase();
cc.increase();

출력

• 이미지로 대체
  

🔗 참고 링크 & 도움이 되는 링크

• javascript module

---

🚩 추가 연산자

단축평가. 논리 연산자 (Logical Operator)

📝 설명

• 논리 연산자는 And(&&)와, Or(||)이 있다.
• 단축평가(short-circuit evaluation) : if구문에서처럼 모든 행이 실행되지 않음

✒️ 사용법

입력

js

const obj1 = { name: "🐶" };
const obj2 = { name: "🐱", owner: "바비" };


if (obj1 && obj2) { // boolean 값으로 변화되어 평가
  console.log("ㅎㅇ");
}

// 조건문 밖에서 사용
result = obj1 || obj2;
console.log("|| 조건문 밖에서 사용", result);
// obj2가 return됨
console.log();

/*  
    - 둘 다 true -    - obj1 false- 
  && : 뒤의 값 리턴 / 앞의 값 리턴
  || : 앞의 값 리턴 / 뒤의 값 리턴
*/

// 활용
function changeOwner(animal) { // 주인이 있는 경우만 변경
  animal.owner = "켄";
}
obj1.owner && changeOwner(obj1); // obj1이 owner가 있을 경우에만 변경. 앞이 true일 경우 뒤 코드 실행
obj2.owner && changeOwner(obj2);
console.log("obj1 changeOwner() 실행 : ", obj1);
console.log("obj2 changeOwner() 실행 : ", obj2);
console.log();

function makeNewOwner(animal) { // 주인이 없는 경우에만 새 주인을 만듦
  animal.owner = "제니퍼";
}
obj1.owner || makeNewOwner(obj1); // obj1이 owner가 없을 경우에 변경(추가)됨. 앞이 false일 경우 뒤 코드 실행
obj2.owner || makeNewOwner(obj2); // 앞이 true라 뒤 코드 실행❌
console.log("obj1 makeNewOwner() 실행 : ", obj1);
console.log("obj2 makeNewOwner() 실행 : ", obj2);

출력

• 이미지로 대체
  

🔗 참고 링크 & 도움이 되는 링크

• javascript 단축평가

---