Javascript
if문에서 true/false 체크에 관하여 
<style>
	body {
	    font-size: 9pt;
	    font-family: "굴림";
	}
	div,
	p,
	ul,
	li {} ul.menu {
	    padding: 10px;
	    list-style: none;
	    border: 1px #000 solid;
	}
	ul.menu li {
	    border: 1px #eeeeee solid;
	    margin: 10px;
	}
	li.select {
	    background-color: #ccc;
	}
</style>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
	var $menu = null;
	var $menuName = null;
	var $selectedItem = null;
	$(document).ready(function() {
	    init();
	    initEvent();
	});
	function init() {
	    $menu = $('ul.menu');
	    $menuName = $('#menuName');
	}
	function initEvent() {
	    $('#add').click(function() {
	        addMenu();
	    });
	    $menu.on('click', 'li', function() {
	        setSelectItem($(this));
	    });
	    $('#update').click(function() {
	        updateMenuItem();
	    });
	    $('#remove').click(function() {
	        removeMenuItem();
	    });
	    $('#up').click(function() {
	        upMenuItem();
	    });
	    $('#down').click(function() {
	        downMenuItem();
	    });
	}
	function addMenu() {
	    var menuName = $menuName.val();
	    var newMenuItem = '<li>' + menuName + '</li>';
	    if ($selectedItem) { // <<= 이런 부분
	        $selectedItem.after(newMenuItem);
	    } else {
	        $menu.append(newMenuItem);
	    }
	}
	function setSelectItem($item) {
	    if ($selectedItem != null) {
	        $selectedItem.removeClass('select');
	    }
	    $selectedItem = $item;
	    $selectedItem.addClass('select');
	}
	function updateMenuItem() {
	    if ($selectedItem) { // <<= 이런 부분
	        var menuName = $('#menuName').val();
	        $selectedItem.html(menuName);
	    } else {
	        alert('No selected Menuitem');
	    }
	}
	function removeMenuItem() {
	    if ($selectedItem) { // <<= 이런 부분
	        $selectedItem.remove();
	        $selectedItem = null;
	    } else {
	        alert('No selected Menuitem');
	    }
	}
	function upMenuItem() {
	    if ($selectedItem) { // <<= 이런 부분
	        var $prevItem = $selectedItem.prev();
	        if ($prevItem) { // <<= 이런 부분
	            $selectedItem.insertBefore($prevItem);
	        } else {
	            alert('No selected Menuitem');
	        }
	    }
	}
	function downMenuItem() {
	    if ($selectedItem) { // <<= 이런 부분
	        var $nextItem = $selectedItem.next();
	        if ($nextItem) { // <<= 이런 부분
	            $selectedItem.insertAfter($nextItem);
	        } else {
	            alert('No selected Menuitem');
	        }
	    }
	}
</script>
<body>
	<div>
	    <input type="text" id="menuName" />
	    <button id="add">
	        추가
	    </button>
	    <button id="update">
	        수정
	    </button>
	    <button id="remove">
	        삭제
	    </button>
	    <button id="up">
	        UP
	    </button>
	    <button id="down">
	        DOWN
	    </button>
	</div>
	<ul class="menu">
	</ul>
</body>


위 소스입니다. 

우선, 전체적인 로직은 다 이해를 합니다. 

다만, 제가 궁금한 부분에 대해서는 //한줄 주석을 달아놓았습니다.


위에 // <<== 이런 부분으로 주석을 달은 if문입니다. 


보통,,책을 보면서 if조건문을 배웠는데요, 

if조건문은 if(조건식) ,,즉, if(i<=0){    이런식으로 해서

변수 i가 0보다 작거난 같을 때,,,라는 식으로 사용이 되었습니다. 


그런데, 위에 주석을 달은 if문에는 그런 비교연산자가 없이

그냥 각각의 객체만 있더군요..

그렇다면 적어도 그 객체가 어떤 조건인지에 대한 true 또는 false와 같은

논리연산자도 없이, 그냥 딸랑 객체만 있습니다.


즉, 

하나를 예를 들자면 if($prevItem){... 이렇게 돼어있는데..

해석하자면, 만약 $prevItem이....로만 끝납니다.

즉, 만약에 $prevItem 이 뭐뭐라면도 없이,,,그냥 if($prevItem)이렇게만 나와서,

$prevItem이 뭘 어쨌다는건지.....만일 $prevItem >= 0 이런 식으로 돼어있다면,

"만약 $prevItem이 0보다 크거나 작으면.." 이렇게 이해를 하겠는데,

그러한 아무런 비교 또는 논리적인 연산도 없이, 그냥 if($prevItem)만 있어서

$prevItem이 뭘 어쨌따는건지,,,이해가 안되더군요..


가령, if($prevItem==true){a} else {b} <<<== 이런 구문은 이해합니다.

즉, $prevItem 객체가 참이면 a를 실행하고, 아니면 b를 실행하라는건데요,,,


if($prevItem){a} else {b} <<== 이런 식으로 나와서,,잘 이해가 안되네요..=.-;;;


언제나 답변주셔서 늘 감사하는 마음입니다. ^^;


0
4
8,255
댓글 4