What does the question mark mean in this function?

Question

Here's the documentation for this plugin (There's only two functions.) http://tkyk.github.com/jquery-history-plugin/#documentation

$(document).ready(function() {
    function load(num) {
        $('#content').load(num +".html");
    }

    $.history.init(function(url) {
        load(url == "" ? "1" : url);
    });

    $('#ajax-links a').live('click', function(e) {
        var url = $(this).attr('href');
        url = url.replace(/^.*#/, '');
        $.history.load(url);
        return false;
    });
});

Here's the html:

<body>
  <h1>jQuery History Plugin Ajax Sample</h1>
  <div id="ajax-links">
    <ul>
      <li><a href="#1">load 1.html</a></li>
      <li><a href="#2">load 2.html</a></li>
      <li><a href="#3">load 3.html</a></li>
    </ul>
    <div id="content"></div>
    <hr />
  </div>
  <p>[<a href="../">All samples</a>] [<a href="http://github.com/tkyk/jquery-history-plugin">Project home</a>]</p>
</body>

Possible duplicates: http://stackoverflow.com/questions/1771786/question-mark-in-javascript http://stackoverflow.com/questions/1688337/javascript-if-alternative http://stackoverflow.com/questions/3322704/javascript-notation http://stackoverflow.com/questions/4278232/javascript-explanation-of-and http://stackoverflow.com/questions/6813840/what-does-this-javascript-code-do — JJJ, Aug 11 '11 at 09:03
This is basic ternary operator of javascript refer http://msdn.microsoft.com/en-us/library/be21c7hw(v=vs.94).aspx — Devjosh, Aug 11 '11 at 09:04
Possible duplicate of [Javascript Ternary operator](http://stackoverflow.com/q/1788917/693207) — Jürgen Thelen, Aug 11 '11 at 09:05
Possible duplicate of [Question mark and colon in JavaScript](https://stackoverflow.com/questions/1771786/question-mark-and-colon-in-javascript) — Boghyon Hoffmann, Jul 01 '19 at 08:20

score 30 · Accepted Answer · answered Aug 11 '11 at 09:04

30

load(url == "" ? "1" : url);

The question mark here is a a ternary if operation, Simply put, it is a short, inline if statement.

Expanded out, the statement would look something like this:

if (url == "")
    load("1");
else
    load(url);

If the statement before the question mark evaluates to true, then the left-hand side of the colon is used, otherwise (if it is false) the right-hand side is used. You can also nest this, though it isn't always a good idea (for readability).

answered Aug 11 '11 at 09:04

foxy

7,599
2
30
34

Why no braces like Curt's answer? – Jarad Dec 16 '17 at 10:42
2

@Jarad If there's only one statement to execute in the block, you don't need the `{}`. Any more than one statement to execute and it requires the `{}` – Kellen Stuart May 31 '18 at 18:34

score 6 · Answer 2 · answered Aug 11 '11 at 09:02

6

Its shorthand for:

If (url == ""){
   load("1");
}
else {
   load(url);
}

Ie. If url equals "" then return "1", otherwise, return url

In your example, if the url equals "" then, 1.html will be loaded, otherwise, url + ".html" will be loaded

answered Aug 11 '11 at 09:02

Curtis

101,612
66
270
352

So those are the return values? I can read it just like you posted, but can you give me the pseudo code? – user784637 Aug 11 '11 at 09:02
I'm confused, wouldn't the proper syntax be to include the word "return"? – user784637 Aug 11 '11 at 09:05
It's called a ternary operator and is basically a shorthand method for a conditional statement - more info at http://en.wikipedia.org/wiki/Ternary_operation – simnom Aug 11 '11 at 09:05

score 2 · Answer 3 · answered Aug 11 '11 at 09:03

2

It is a ternary operation.

answered Aug 11 '11 at 09:03

Sjoerd

74,049
16
131
175

What does the question mark mean in this function?

3 Answers3