1) if문

• if(조건)또는 if(boolean값).

• 소괄호 안의 조건이 true/false인지에 따라 코드를 처리할 지 결정함.

• 조건이 true(참)이면 if의 중괄호 { }안의 코드를 처리하고, false(거짓)이면 처리하지 않고 건너뜀

• 비교 연산자

  기호	의미
  >	크다(초과)
  <	작다(미만)
  >=	크거나 같다(이상)
  <=	작거나 같다(이하)
  ==	같다(값이 같을 때)
  !=	같지 않다(값이 다를 때)
  ===	같다(값과 데이터형이 같을 때)
  !==	같지 않다(값과 데이터형이 다를 때)

• 만약 경계에 부딪친다면 반사하는 원을 구현해보자.

공의 끝이 닿으면 튕기게 수정 width-15

• 논리 연산자

  기호	의미		사용법
  &&	AND	그리고	if(조건1 && 조건2) : 조건1 그리고 조건2가 동시에 참일 경우 true, 아니면 false
  			OR
  !	NOT	아니다	if(!조건) : 조건이 참이 아닐 경우 true, 참일 경우 false

• 좌우 반사하는 원을 구현해보자.

: 논리 연산자 대신 if를 두 번 써도 결과가 같다.

• 좌우 반사하는 선과 조건에 따라 점멸하는 원을 만들어보자. 선이 좌우로 움직이고 원은 가운데 고정인 상태에서 원이 깜빡하고 나타났다 사라짐.

과제8) IF문의 활용

• 아래의 문제를 풀어 결과물을 제출하시오.(캔버스의 크기는 400*400으로 설정하며, 세로선이나 가로선의 색상은 흰색이다.)
  1. 좌우로 반사하는 원이 중앙에 위치하는 세로선에 닿을 때, 랜덤하게 색이 바뀌도록 코드를 작성하시오.(필수 제출)

1. 상하로 반사하는 원과 사각형이 중앙에 위치하는 가로선에 닿을 때, 랜덤하게 색이 바뀌도록 코드를 작성하시오.

   (단, 원의 시작점은 (100, 0)이고, 사각형의 시작점은 (200, 300)이다.) (선택 제출)

   1) if문 추가 예제

   ---

   • 상하좌우 반사하는 원을 만들어보자.

   

   • 상하좌우 반사하는 원과 마우스를 따라오는 원을 만들고, 이 때 두 원이 충돌하면 원의 색상이 랜덤하게 바뀌도록 만들어보자.

   

   let x=0, y=0; let vx=4, vy=3; let d; function setup(){ createCanvas(400,400); } function draw(){ background('gray'); ellipse(x,y,30,30); ellipse(mouseX,mouseY,30,30); x+=vx y+=vy if(x<0||x>width ){ vx*=-1 } if(y<0||y>height){ vy*=-1 } d=dist(x,y,mouseX,mouseY); if(d<15){ fill(random(255),random(255),random(255),200); } textSize(30); text('20633 홍길동',220,380); }

   • 1초마다 원의 색상이 랜덤하게 바뀌도록 타이머 기능을 가진 원을 만들어보자.

     • millis( ) 함수 : 코드 실행 이후의 경과 시간을 밀리초 단위의 정수로 반환하는 시간 함수

       

     //마우스를 누르는 좌표에 생성되는 원들을 선으로 연결

     

//마우스를 누르는 좌표에 생성되는 원들을 선으로 연결
let x1=0,y1=0, x2=0,y2=0;
function setup() {
createCanvas(400, 400);
background('gray');
}
function draw() {
stroke('yellow');
fill('yellow');
ellipse(x1,y1,30,30);
line(x1,y1,x2,y2);
x2=x1;
y2=y1;
}
function mousePressed(){
if(mouseButton===LEFT){
x1=mouseX;
y1=mouseY;
}
if(mouseButton===RIGHT){
background('gray');
textAlign(CENTER);
textSize(20);
text('Last Circle',x1,y1+50);
}
textSize(20);
text('20633 홍길동',320,380);
}