WEB-JavaScript (2) - 4주차

리팩토링 중복의 제거

-비효율적인 코드 중복 제거 

 

this - 중복되는 id 를 제거 할 수 있음

 

var target = document. querySelector('body");

 

document.querySelector("body") .style .color = 'white' ;

 

--> target.style.color = 'white';

 

반복문

#배열

<h1> Array </h1>
<h2> Syntax </h2>

<script>
	var coworkers = ["egoing" , "leezche" ];
</sctipt>

<h2> Get </h2>
<script>
	document.write(coworkers[0]);
    document.write(coworkers[1]);
    
</script>
<h2> Add </h2>
<script>
	coworkers.push('duru');
    coworkers.push('taeho');
    
<h2> Count </h2>
<script>
	document.write(cowokers.length);
</script>

Array

Syntax

Add

#반복문

<h1> loop </h1>
<ul>
<script> 
	document.write('<li>1</li>');
    var i = 0;
    while(i<3 ){
    document.write('<li>2</li>');
    document.write('<li>3</li>');
    i = i+1;
    }
    document.write('<li>4</li>');
    
    
  </scirpt>
   </ul>

loop

#매개변수와 인자 

<h1> Function </h1>
<h2> Basic </h2>


<ul>
<script> 
function two() {
	document.write('<li>2-1</li>');
    document.write('<li>2-2</li>');

}
	document.write('<li>1</li>');
    two();
    document.write('<li>3</li>');
    two();
   </script>
   
   </ul>
   <h2> parameter & argument </h2>
   
   <script>
   	function onePlusOne() {
    	document.write(1+1);
        
    }
    function sum(left, right) { //매개변수 (parameter)
    	document.write(left+right+'<br>');
    }
    onePlusOne();
    
    sum (2,3);
    sum (3,4);
    </script>

Function

Basic

parameter & argument

#함수 리턴

<h2>return </h2>
<script>

function sum2(left, right){
	return left+right;
}
document.write(sum(2,3) +'<br>');
document.write('<div style = "color:red>' + sum(2,3) + '</div>');



</script>

객체 

<h1> Object </h1>

<script>
	var coworkers = {
    
    
    
    "programer" : "egoing:" ,
    "designer" : "leezche"}; // 객체 생성
	
	document.write("prigrammer : " +cowokers.programmer);

</script>

#객체 프로퍼티와 메소드 

<script>
cowokers.showAll = function(){ //function showAll(){} 과 같은 표현

 	for( var key in this) {
    
    document.write (key + ':'+this[key] + '<br>'); //coworkers
    
    }
    }
    cowokers.showAll();
    
    

</script>