Global JavaScript variable with OpenLayers3

Question

Why is this working?

function addMap() {
  var view = new ol.View({
    center: ol.proj.fromLonLat([29.5646, 44.1575]),
    zoom: 4
  });
  var map = new ol.Map({
    target: 'map',
    layers: [
      new ol.layer.Tile({
        source: new ol.source.OSM()
      })
    ],
    view: view
  });
}

...and this isn't?

var view = new ol.View({
  center: ol.proj.fromLonLat([29.5646, 44.1575]),
  zoom: 4
});

function addMap() {
  var map = new ol.Map({
    target: 'map',
    layers: [
      new ol.layer.Tile({
        source: new ol.source.OSM()
      })
    ],
    view: view
  });
}

I thought if variable is outside function, it's global variable and it can be used from all other places.

Answer 1

the issue is that you are running javascript on the document before the document has been loaded so

1. move your javascript code to the end of the body or

2. you can do all this in

    $(document).ready(function() { var view = new ol.View({ center: ol.proj.fromLonLat([29.5646, 44.1575]), zoom: 4 }