Q:

How To add JS file in frontend for all pages

I've read 3 pages of Google Results on how to load a JS file for all pages and still am not able to do it. 
I've got a few doubts, hope somebody can clear them out.

Do I need to create a module inside app/code with the requirejs-config.js ? Or I can put a requirejs-config.js inside my theme instead?
What should I put inside requirejs-config.js ?
What should the code look like inside my .js file? I saw that you can't use jQuery's document.ready and you must have a define([
What should I put inside define([ ?
If I've got third party jQuery modules, do I have to edit them to make them work?
Do I need to put xml somewhere to tell magento that my.js file exists?
If I create a module inside app/code with all the js code there, would it include all the stuff in all pages? How can I achieve that?

A:

To load a custom main.js file on all pages (in the RequireJS-way) this is a good way:
1) Create main.js
Create main.js within the theme folder
<theme_dir>/web/js/main.js
with this content:
define([
  "jquery"
], 
function($) {
  "use strict";

  // Here your custom code...
  console.log('Hola');

});

In short: we declare dependencies at the start, e.g. "jquery". We define as function's parameter the variable name for using the dependency within the function, e.g. "jquery" --> $. We put all our custom code within function($) { ... }.
2) Declare main.js with a requirejs-config.js file
Create a requirejs-config.js file within the theme folder:
<theme_dir>/requirejs-config.js
with this content:
var config = {

  // When load 'requirejs' always load the following files also
  deps: [
    "js/main"
  ]

};

"js/main" is the path to our custom main.js. The ".js" extension is not required.
Our requirejs-config.js will be merged with other requirejs-config.js defined in Magento.
RequireJS will load our main.js file, on each page, resolving dependencies and loading files in an async way.

Optional: Including third-party library
This is the way to include third-party libraries.
1) Add the library in web/js:
<theme_dir>/web/js/vendor/jquery/slick.min.js
2) Open requirejs-config.js and add this content:
var config = {

  deps: [
    "js/main"
  ],

  // Paths defines associations from library name (used to include the library,
  // for example when using "define") and the library file path.
  paths: {
    'slick': 'js/vendor/jquery/slick.min',
  },

  // Shim: when you're loading your dependencies, requirejs loads them all
  // concurrently. You need to set up a shim to tell requirejs that the library
  // (e.g. a jQuery plugin) depends on another already being loaded (e.g. depends
  // on jQuery).
  // Exports: if the library is not AMD aware, you need to tell requirejs what 
  // to look for so it knows the script has loaded correctly. You can do this with an 
  // "exports" entry in your shim. The value must be a variable defined within
  // the library.
  shim: {
    'slick': {
      deps: ['jquery'],
      exports: 'jQuery.fn.slick',
    }
  }

};

It looks more complicated than what it actually is.
3) Add the dependency within main.js:
define([
  'jquery',
  'slick'
], 
function($) {

  // ...

});

A:

Duplicate the file:

app/code/Magento/Theme/view/frontend/layout/default_head_blocks.xml

To 

app/code/your_vendor/your_theme/Magento_Theme/layout/default_head_blocks.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <!-- Add local resources -->
        <css src="css/my-styles.css"/>

        <!-- The following two ways to add local JavaScript files are equal -->
        <script src="Magento_Catalog::js/sample1.js"/>
        <link src="js/sample.js"/>

        <!-- Add external resources -->
        <css src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" src_type="url" />
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" src_type="url" />
        <link src="http://fonts.googleapis.com/css?family=Montserrat" src_type="url" /> 
    </head>
</page>

For more information:
http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/layouts/xml-manage.html
Good luck!
BTW
read the frontend devdocs official from magento to get the basic :)

A:

You can add JS files using xml as below. This will add js in all the pages.
With custom module:
Create default.xml file in your module.
app/code/vendor_name/module_name/view/frontend/layout/default.xml
<?xml version="1.0"?>
<page xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <head>
        <!-- Add js using link tag-->
        <link src="js/script.js"/>

        <!-- Add js-->
        <script src="Vendor_Module::js/script.js"/>

        <!-- Add external js -->
        <script src="https://apis.google.com/js/platform.js" src_type="url" />
   </head>
</page>

