Relational Operators Precedence and Associativity in TypeScript

Operators in TypeScript have rules of Precedence and Associativity that determine how expressions are evaluated. Here I describe Precedence and Associativity separately.

Precedence

If I talk about the Precedence of relational operators then all Relational operators have the same precedence.

Associativity

If an expression contains several relational operators of the same Precedence, then how to evaluate that expression? The answer to this question is Associativity and relational operators, which have the same Precedence in a single expression or say when two or more operators (such as (<=) and (>)) with the same Precedence can be applied to the same operand, the left to right associativity will cause the leftmost operator to be applied first. The associativity of a relational operator is given below.
Precedence Operator Associativity
Equal > >= < <= != == Left-Right

For example, if we write this code:
  1. if (true == > 2 <= true) {
  2. document.write("The value is True");
  3. } else {
  4. document.write("False");
  5. }
then the result is the value True because the above example is evaluated this way.
(a) true = = 4, this expression is evaluated first, on the behalf of left to right associativity and it returns "true", in other words, 1.
(b) After the step a remaining part, if (true <=true) or say (1 <=1) is evaluated, and finally it gives also True as its result or says it returns one.
Now for another example, if we write this code, then what will happen?
  1. if (2 <= true)
This expression gives an error because relational operators perform associativity from left to right, then (2<=true) gives an error (because a numeric value cannot be compared with a boolean value).
The following examples show how to use Precedence and Associativity with relational operators in TypeScript. Use the following to create a program using relational operators.
Step 1
Open Visual Studio 2012 and click on "File" menu -> "New" -> "Project". A window will be opened, provide the name of your application like "RelationalOperators", then click on the Ok button.
Step 2
After Step 1 your project has been created. The Solution Explorer, which is at the right side of Visual Studio, contains the js file, ts file, css file and html files.
Step 3
The code of the Relational operator's program.

RelationalOperators.ts

  1. class RelationOperators {
  2. MyFunction() {
  3. var a = 4,
  4. b = 2;
  5. if (true == a > b <= true) {
  6. document.write("The value is True");
  7. } else {
  8. document.write("False");
  9. }
  10. }
  11. }
  12. window.onload = () => {
  13. var call = new RelationOperators();
  14. call.MyFunction();
  15. }

default.html

  1. < !DOCTYPEhtml >
  2. <
  3. htmllang = "en"
  4. xmlns = "http://www.w3.org/1999/xhtml" >
  5. <
  6. head >
  7. <
  8. metacharset = "utf-8" / >
  9. <
  10. title > TypeScript HTML App < /title>
  11. <
  12. linkrel = "stylesheet"
  13. href = "app.css"
  14. type = "text/css" / >
  15. <
  16. scriptsrc = "app.js" > < /script>
  17. <
  18. /head>
  19. <
  20. body >
  21. <
  22. divid = "content" / >
  23. <
  24. /body> <
  25. /html>

app.js

  1. var RelationOperators = (function() {
  2. function RelationOperators() {}
  3. RelationOperators.prototype.MyFunction = function() {
  4. var a = 4;
  5. var b = 2;
  6. if (true == a > b <= true) {
  7. document.write("The value is True");
  8. } else {
  9. document.write("False");
  10. }
  11. };
  12. return RelationOperators;
  13. })();
  14. window.onload = function() {
  15. var call = new RelationOperators();
  16. call.MyFunction();
  17. };
Step 4
The output of the program looks like:
relational-operators-Precedence-Associativity-in-typescript.jpg