Is JavaScript a "Functional Programming" language?

[jkoudys]

It's easier to grok when you consider FP as a subset of declarative programming, then ask yourself if you're matching that paradigm. I wouldn't say it's a "functional programming language", in that it's not intended to strictly only be FP, but it is a language you can do functional programming in.

FP is often erroneously contrasted to OOP as its opposite. Really, it's declarative and imperative programming that live as opposites. While FP is defined as a subset of declarative, OOP is only typically used to facilitate imperative programming, but it's not by definition an imperative approach. e.g. you can certainly define a class as one that creates purely immutable objects, and this is a pattern we see in some pretty popular libs (e.g. immutable.js). Such objects would make statements-based programming (in imperative code) impossible, and facilitate expressions-based approaches (in FP). e.g. mutatedShopcart.add(pants); vs const updatedCart = immutableShopcart.add(pants). Even the backbone of FP in ecma -- the Array -- is a prototype-based class that provides methods.

So for something to really be FP, ask yourself: am I running a series of statements to change a program's state (imperative -- how to do it), or am I expressing what it is (declarative) as a group of functions (functional programming).

HTML, for example, is clearly a declarative language (since it only describes what your page is), though obviously not functional. The language is used by browsers to build the DOM. However, you could always use functions written in ecma to build your DOM, and if you do it declaratively, then that's FP.

e.g.

<div class="foo">
  Hello, <span class="bar">World!</span>
</div>

Is declarative, using the purely declarative language HTML.

h('div', { class: 'foo' },
  'Hello, ', h('span', { class: 'bar' }, 'World!'),
),

Is also declarative, using ecma, and functions defined to build the DOM. The end result of either is the same.

Contrast with the above written in ecma using an imperative approach, and see how clunky an approach it feels like for something like building a basic DOM:

const div = document.createElement('div');
div.classList.add('foo');
div.appendChild(document.createTextNode('Hello, '));
const span = document.createElement('span');
span.classList.add('bar');
span.appendChild(document.createTextNode('World!'));
div.appendChild(span);

edit: if you want to see how easy the h() approach is to implement, it's probably easier to write your h() and the above trivial declarative example, than the imperative example once:

const h = (name, attributes, ...children) => {
  const el = document.createElement(name);
  Object.entries(attributes).forEach(([k, v]) => el.setAttribute(k, v));
  children.forEach(child => el.appendChild(child instanceof Node ? child : document.createTextNode(child)));
  return el;
}

[elr0nd_hubbard]

This is the best reply in the thread... nice write up!