What Does ':' (Colon) Do in JavaScript

What does ':' (colon) do in JavaScript?

var o = {
    r: 'some value',
    t: 'some other value'
};

is functionally equivalent to

var o = new Object();
o.r = 'some value';
o.t = 'some other value';

What does the colon (:) in JavaScript represent?

This is an object literal ^[MDN]:

var obj = {
    key: value
};

// obj.key === value; // true

It assigns value to a property key of obj. While there are no restriction for what value can be (well, it must be something assignable), there are limitations for key: It must be either an identifier name, a string literal or a numeric literal.

More details can be found in section 11.1.5 of the ECMAScript specification.

The literal notation is similar to:

var stuffToDo = {}; // <-- empty object literal

stuffToDo.bar = function() {...};
// or stuffToDo['bar'] = ...

stuffToDo.baz = function() {...};
// or stuffToDo['baz'] = ...

The biggest difference is that when using an object literal, you cannot access other properties of the object during the declaration.

This will not work:

var obj = {
    foo: value,
    bar: obj.foo
};

whereas this does:

var obj = {};
obj.foo = value;
obj.bar = obj.foo;

---

For completeness, there are two other uses of colons in JavaScript:

• Conditional (ternary) operator ^[MDN]:

  var val = condition ? true-value : false-value;
  

• Labels ^[MDN]:

  someLabel: var x = 5;
  

What does a colon mean on a directory in node js?

As SLaks stated, it's a URL pattern, the colon means that you want to receive the URL segments as parameter, here is an example

app.get('/user/:id', function(request, response){
  response.send('user ' + request.params.id);
});

in this example, if you will send a get request to the URL www.server.com/user/mike, the request.params.id will be set to mike.

JavaScript colon operator

That's not a fair comparison, although you're almost there.

var store = new dojo.data.ItemFileReadStore({
         url: "countries.json"
 });
//Creates a new store object, passing an anonymous object in with URL
// property set to "countries.json"

The alternative without the colon operator is:

var props={};
props.url="countries.json"
var store = new dojo.data.ItemFileReadStore(props);
//Does same as above but doesn't use :

Not this isn't the only use of : in JavaScript though, it can also be used in the ternary operator (alert(b==c?'equal':'not equal');) and in labels (for example in case statements)

Within a string, how to check whether the previous character ahead of another one is a space?

I would use a replace method with a regex which captures both the optional whitespace (also as sequence) and the colon ...

/(\s*)(:)/g

The callback function of replace gets passed as its arguments ...

1. the entire match ... e.g. either ' :' or just ':'
2. the 1st capture for the whitespace ... e.g. either ' ' or just ''
3. the 2nd capture for the colon ... of cause always ':'

Thus within a callback function one can test for the existence of whitespace(s).

function replaceWsColonGroup(match, space, colon) {
  console.log({ match, space, colon });
  return (space || " ") + colon;
}
const regXWsColonGroup = (/(\s*)(:)/g);

console.log(
  ' I am: learning javascript =>\n',
  'I am: learning javascript'.replace(regXWsColonGroup, replaceWsColonGroup),
  '\n\n'
);
console.log(
  ' I am : learning javascript =>\n',
  'I am : learning javascript'.replace(regXWsColonGroup, replaceWsColonGroup),
  '\n\n'
);
console.log(
  ' I am\n\t: learning javascript =>\n',
  'I am\n\t: learning javascript'.replace(regXWsColonGroup, replaceWsColonGroup),
  '\n'
);

.as-console-wrapper { min-height: 100%!important; top: 0; }

Select elements by attributes with : (colon)

You need to escape the colon

document.querySelectorAll('[xml\\3A space]')

I used https://mothereff.in/css-escapes to get the code above :)

colon expected javascript error on ajax call in IE

Shorthand object properties (eg:let o = {a, b, c}) are an ES6 feature, not supported on IE11

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer

https://caniuse.com/#search=es6

To fix it, change your data to use the standard key: value notation.

    data: { IsMedical: IsMedical, IsDental: IsDental, IsVision: IsVision, IsLife: IsLife, carrierId: carrierId, employerId: employerId, formId: formId, submissionTypeId: submissionTypeId },

---

Related Topics