javascript: !( booleanCondition() ) vs ( booleanCondition() == false )

Question

The title says it all, but let's say I have a hasAccess() function returning true or false

I use it in a ExtJS 4 toolbar button config like this :

{
  id:      'btnEditMyStuff',
  ref:     'edit_my_stuff',
  xtype:   'button',
  text:    'Edit',
  hidden:  !( MyUser.hasAccessTo('EditMystuff') )            
}

Even if this expression gets correctly evaluated to false when tested in Firebug, my button won't show up.

But with this :

{
  id:      'btnEditMyStuff',
  ref:     'edit_my_stuff',
  xtype:   'button',
  text:    'Edit',
  hidden:  ( MyUser.hasAccessTo('EditMystuff') == false )            
}

the button is correctly displayed.

The question is : what is the difference ?

What mysterious comparison operators/function evaluation precedence am I overlooking here ?

I want to go to bed less dumb than yesterday. Thanks in advance.

EDIT :

 hidden:  !( MyUser.hasAccessTo('EditMystuff') )  // does not work
 hidden:  (!MyUser.hasAccessTo('EditMystuff') )   // works    

but still I crave to fully understand.

Answer 1

Well you are mostly right

!(true) is false
!(false) is true

and

 true == false is false
 false == false is true

So if the input is only true and false but if the input is a empty array then you could have

 ![] is false

but

  []==false is true