Skip to content

Instantly share code, notes, and snippets.

@dotherightthing
Last active August 27, 2019 06:00
Show Gist options
  • Save dotherightthing/91f158570e9c65001f5f6880e6ecd020 to your computer and use it in GitHub Desktop.
Save dotherightthing/91f158570e9c65001f5f6880e6ecd020 to your computer and use it in GitHub Desktop.
[Imperative vs Declarative programming] #react #functional #javascript

Imperative vs Declarative programming

From Imperative vs Declarative Programming and React for People Who Think Things Like React are Weird and Hard.

In real life

How do I get to your house from here?

Imperative response

Go out of the north exit of the parking lot and take a left. Get on I-15 North until you get to the 12th street exit. Take a right off the exit like you’re going to Ikea. Go straight and take a right at the first light. Continue through the next light then take your next left. My house is #298.

A declarative response

My address is 298 West Immutable Alley, Eden, Utah 84310

it’s important to realize that many declarative approaches have some sort of imperative abstraction layer

Knowing the address assumes you have some sort of GPS that knows the imperative steps of how to get to your house.

With code

Imperative

$("#btn").click(function() {
  $(this).toggleClass("highlight")
  $(this).text() === 'Add Highlight'
    ? $(this).text('Remove Highlight')
    : $(this).text('Add Highlight')
})

Declarative

<Btn
  onToggleHighlight={this.handleToggleHighlight}
  highlight={this.state.highlight}>
    {this.state.buttonText}
</Btn>

your code is concerned with what the ultimate goal is — rather than the steps it takes to accomplish that goal

In computer science, declarative programming is a programming paradigm that expresses the logic of a computation without describing its control flow.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment