A bit explanation: why this works on JSFiddle even with var
.
By default, jsfiddle has next setting:
Load Type: OnLoad
and this generates next code:
<script type="text/javascript">//<![CDATA[
window.onload=function(){
var status = {
'To Do': 1,
'Received': 2,
'In Progress': 3,
'Rejected': 4,
'Verify': 5,
'Live': 6
};
var data = [{
userName: "One",
status: "Live"
},
{
userName: "Two",
status: "Rejected"
},
{
userName: "Three",
status: "To Do"
},
{
userName: "Four",
status: "Verify"
},
{
userName: "Five",
status: "Received"
},
{
userName: "Six",
status: "In Progress"
}
];
data = data.sort((a, b) => status[a.status] - status[b.status]);
console.log(data);
}//]]>
</script>
As you can see, status
in this case is a local variable, instead property of global object.
If change this settings to one of this:
No wrap - in head
No wrap - in body
You get same behavior as in snippet before.
BTW, code rendered in snippet same as for settings No wrap - in body
window.status
(MDN), it's not an SO defined property. SO should not protect you from conflicts with basewindow
properties. Doing so would result in masking errors, making it impossible to reproduce some issues.