Interacting with JavaScript¶
Let’s say you wanted to write a function to find the distance between two points (x1, y1) and (x2, y2), using the Pythagorean distance formula:
You will need a square root function, but you can’t write something like (sqrt 3) because ClojureScript doesn’t have a built-in square root function. You need to use the sqrt function built into JavaScript’s Math object. Here’s the code:
Here’s the key part: (.sqrt js/Math ...). In order to understand exactly what’s going on, you have to know a little bit about:
JavaScript Objects¶
One of JavaScript’s key concepts is an object. You can think of an object as a way of bundling data and the functions related to that data together. (This is a massive and probably grotesque oversimplification, but it will serve.) In object-programming terms, the data are called properties and the functions are called methods. The Math object has properties like PI and methods like sqrt, sin, and so on. A web page has a document object. One of its properties is the title property; a piece of data that contains the document’s title. One of a document’s methods is the getSelection() method; this function returns the text that the person reading the web page has selected.
Here are some common tasks you will do with JavaScript objects, and how you do them in ClojureScript. In each instance, you must use js/ to indicate that the object you are manipulating is part of JavaScript (or, to be exact, that the object is in the JavaScript namespace).
| Task | ClojureScript | Example |
|---|---|---|
| Call a method | (.method js/object argument ...) |
(.max js/Math 3 5 7 2) |
| Get a property’s value | (.-property js/object) |
(.-title js/document) |
| Create a new object | (js/object.) |
(js/Date.) |
| Set a property’s value | (set! (.-property js/object) value) |
(set! (.-title js/document) "New Title") |
Quick summary: to call a method, precede its name with a dot. To get a property’s value, precede its name with a dot and dash. To create a new object, follow its class name with a dot.
Exercises¶
The trigonometric functions like sin and cos require their arguments in radians, but most
people think of angles in degrees. Write a function named to-radians that converts its argument
in degrees to radians. You convert to radians by multiplying by pi and dividing by 180. Use the PI
property of the Math object in your solution.
Then use your to-radians function to calculate the sine of 30 degrees.
Because computations have a limited number of digits of accuracy, the result of running
your code will be something like 0.4999999... instead of exactly 0.5
Write a function named compounding that takes four arguments and
uses this formula for compound interest:
Where P is the principal, r is the interest rate, n is the number of times per year the interest is compounded, and t is the number of years you accumulate interest.
To raise a number to a power, use JavaScript Math object’s pow function. For example,
to calculate 3 to the 5th power, you would say (.pow js/Math 3 5)
Then use your function to calculate the value of a $1,000 principal at an interest rate of 5% (that is, r is 0.05), calculated four times a year for 20 years.
We’ll come back to JavaScript later when we discuss interaction with a web page.