Preciso de um help dos amigos para entender o que tem de errado no código.
 
	Trata-se de uma função básica para exibir/ocultar uma div, alterando a propriedade display do CSS. Acontece que no primeiro clique já era para exibir a div, mas a exibição só acontece no segundo clique e a partir daí funciona normalmente, ou seja, exibe e oculta a cada clique.
 
	Meu código faz uma verificação inicial do valor de display (inicializado como none no CSS) e, caso seja igual a none, muda para flex, só que essa verificação e consequente troca dos valores do display só acontece a partir do segundo clique. 
 
	UPDATE: amigo sugeriu colocar inline o estilo que exibe/oculta a div, fiz e resolveu, mas acontece que isso é uma gambiarra e gostaria de saber o que realmente está acontecendo.
 
	Segue o código abaixo ou se quiserem ver no Codepen o link está abaixo.
 
	https://codepen.io/clovis-alberto-block/project/editor/ZBLgmK
 
	Valeu pela ajuda!
 
<!DOCTYPE html>
<html>
<head></head>
<body>
<style>
h1 {
display:block;
margin:10px;
}
h1:hover {
cursor:pointer;
color:lime;
} 
.modal{
position: relative;
height: 100px;
width: 100em;
background: red;
}
#exibeModal{
    display:none;
}
    </style>
    <div id="container">
        <h1 class="one" id='um' onclick="someFunction('one',this)">Clique 01</h1>
        <h1 class="two" id='dois' onclick="exibeModal('exibeModal',this)">Clique 02</h1>
        <h1 class="three" id='tres' onclick="exibeModal('exibeModal',this)">Clique 03</h1>
        <h1 class="four" id='quatro' onclick="someFunction('four',this)">Clique 04</h1>
    </div>
    <div class="modal" id="exibeModal">
    </div>
<!-- ------------------------------------------------------------------------------- -->
    <script type="text/javascript">
    function someFunction(abc,obj) {
        console.log(obj.id);        
    }
    function exibeModal(abc,obj){
        var exibir = document.getElementById(abc);
        if (exibir.style.display == 'none') {
            exibir.style.display = 'block';  
            console.log(obj.id); 
        } else {
            exibir.style.display = 'none';
            console.log(obj.id);
        }        
    }
    </script>
</body>
</html>