本文详细解析JavaScript中冒号(:)的四种主要用法：switch语句分支、?:三元表达式的false分支、对象直接量成员声明以及标签语句。通过对比不同对象创建方式及HTML事件中的协议前缀，阐明冒号在语法结构中的关键作用，帮助开发者准确掌握其应用场景。
冒号在JavaScript中频繁出现，但网络上关于其用法的介绍往往零散且缺乏深度，容易让人困惑。经过两天的资料查阅与整理，我对冒号（:）的使用有了更清晰的认识，特此总结，希望能帮助其他开发者理清思路。
switch与三元运算符中的冒号
1、switch语句分支
2、?:三元表达式的false分支
3、声明对象直接量的成员
4、声明标签
1和2相信地球人都知道吧？如果有人不知道,那我改成地球上的程序员都知道,哈哈
对象直接量中的冒号用法
第三点涉及对象直接量，我们需要先明确什么是对象直接量。
对象直接量（亦称对象初始化程序）由一组属性/值对组成，这些对之间用冒号分隔，而不同的属性对之间则用逗号分隔，整个结构被包裹在花括号{}中。
JavaScript中的对象可以像C#或Java等面向对象语言中的对象一样，拥有属性和方法。
在JavaScript中创建对象有多种方式，例如可以使用Object构造函数来创建。
代码如下:
var obj1 = new Object();
obj1.X = "20px";
obj1.Y = "30px";
obj1.myFunction = function() { alert("我是一个方法！"); };
obj1.myFunction();用对象直接量创建一个对象:
代码如下:
var obj2={X:"20px",Y:"30px",myFunction:function(){alert("我是一个方法！");}}
obj2.myFunction();使用对象直接量创建对象的方式看起来更加简洁直观。
当然，你也可以先定义一个类似类的构造函数，然后通过new关键字创建实例。
代码如下:
function myClass(x, y) {
this.X = x;
this.Y = y;
}
myClass.prototype.myFunction=function(){
alert("我是一个方法！");
}
var obj3 = new myClass("20px", "30px");
obj3.myFunction();4、声明标签
HTML事件中的协议前缀与标签声明
脚本语言种类繁多，除了JavaScript，其他脚本语言也能实现类似功能。
例如：
<input type="button" onclick="vbscript:vbFunction()" value='按钮'/>
当点击按钮时，浏览器会使用vbscript语法执行你定义的vbFunction方法。
如果将onclick后面的vbscript:vbFunction()改为javascript:vbFunction();，则可能会出错。
在某些情况下，你可以省略协议前缀直接调用方法。
<input type="button" onclick="vbFunction()" value='按钮'/>
此时，onclick中的方法无论使用vbscript还是javascript，IE浏览器会自动识别并执行相应的语法，但其他浏览器不支持vbscript。
平时使用JavaScript时，习惯上会加上声明前缀，即"javascript:"。
<input type="button" onclick="javascript:alert('你点击了我！')" value='按钮'/>
"javascript:"前缀常被一些安全研究人员或黑客利用，用于绕过简单的HTML表单限制、Cookie/Session验证，甚至进行SQL注入。如需了解具体原理，请查阅其他资料，但请确保仅用于合法学习，切勿用于破坏。
这里做一个简单的演示例子：
首先打开www.baidu.com首页，然后将下面这行代码直接复制到浏览器地址栏并按回车。
javascript:alert(document.forms[0].wd.value='csdn');document.forms[0].submit()
效果如何？不错，我们利用JavaScript直接操作了搜索框中的文本，并执行了表单提交。更复杂的操作，大家可以自行研究。