Web开发技术梳理 0x6 JavaScript（0x3）表达式和运算符

运算符

赋值运算符

解构，解构赋值语法是一个能从数组或对象对应的数组结构或对象字面量里提取数据的 Javascript 表达式。

var foo = ["one", "two", "three"];

// 不使用解构
var one   = foo[0];
var two   = foo[1];
var three = foo[2];

// 使用解构
var [one, two, three] = foo;

比较运算符

算术运算符

位运算符

逻辑运算符

短路求值：逻辑表达式进行求值是从左到右

false && anything // 被短路求值为false
true || anything // 被短路求值为true

字符串运算符

console.log("my " + "string"); // console logs the string "my string".

条件(三元)运算符

条件 ? 值1 : 值2条件 ? 值1 : 值2

逗号运算符

var x = [0,1,2,3,4,5,6,7,8,9]
var a = [x, x, x, x, x];

for (var i = 0, j = 9; i <= j; i++, j--)
  console.log('a[' + i + '][' + j + ']= ' + a[i][j]);
一元操作符

一元操作符

delete 删除一个对象或一个对象的属性或者一个数组中某一个键值。

delete objectName;
delete objectName.property;
delete objectName[index];
delete property; // legal only within a with statement

x = 42;
var y = 43;
myobj = new Number();
myobj.h = 4;    // create property h
delete x;       // returns true (can delete if declared implicitly)
delete y;       // returns false (cannot delete if declared with var)
delete Math.PI; // returns false (cannot delete predefined properties)
delete myobj.h; // returns true (can delete user-defined properties)
delete myobj;   // returns true (can delete if declared implicitly)

删除数组中的元素时，数组的长度是不变的，例如删除a[3], a[4]，a[4]和a[3] 仍然存在变成了undefined。

扫描二维码关注公众号，回复： 5693950 查看本文章

typeof 返回一个字符串，表示未经计算的操作数的类型。

var myFun = new Function("5 + 2");
var shape = "round";
var size = 1;
var today = new Date();

typeof myFun;     // returns "function"
typeof shape;     // returns "string"
typeof size;      // returns "number"
typeof today;     // returns "object"
typeof dontExist; // returns "undefined"

typeof true; // returns "boolean"
typeof null; // returns "object"

typeof 62;            // returns "number"
typeof 'Hello world'; // returns "string"

typeof document.lastModified; // returns "string"
typeof window.length;         // returns "number"
typeof Math.LN2;              // returns "number"

typeof Date;     // returns "function"
typeof Function; // returns "function"
typeof Math;     // returns "object"
typeof Option;   // returns "function"
typeof String;   // returns "function"

void 表明一个运算没有返回值。

<a href="javascript:void(0)">Click here to do nothing</a>

<a href="javascript:void(document.form.submit())">
Click here to submit</a>

关系操作符

关系操作符对操作数进行比较，根据比较结果真或假，返回相应的布尔值。

in 如果所指定的属性确实存在于所指定的对象中，则会返回true。

// Arrays
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
0 in trees;        // returns true
3 in trees;        // returns true
6 in trees;        // returns false
"bay" in trees;    // returns false (you must specify the index number,
                   // not the value at that index)
"length" in trees; // returns true (length is an Array property)

// Predefined objects
"PI" in Math;          // returns true
var myString = new String("coral");
"length" in myString;  // returns true

// Custom objects
var mycar = {make: "Honda", model: "Accord", year: 1998};
"make" in mycar;  // returns true
"model" in mycar; // returns true

instaanceof 如果所判别的对象确实是所指定的类型，则返回true

var theDay = new Date(1995, 12, 17);
if (theDay instanceof Date) {
  // statements to execute
}

运算符优先级

表达式

JavaScript有以下表达式类型：

算数
字符串
逻辑值
基本表达式
左值表达式

基本表达式

this

this关键字被用于指代当前的对象，通常，this指代的是方法中正在被调用的对象。this关键字被用于指代当前的对象，通常，this指代的是方法中正在被调用的对象。

this["propertyName"]
this.propertyName

分组操作符——分组操作符（）控制了表达式中计算的优先级.

左值表达式

new——可以使用new operator 创建一个自定义类型或者是预置类型的对象实例。

var objectName = new objectType([param1, param2, ..., paramN]);

super——可以用来调用一个对象父类的函数，它在用来调用一个类的父类的构造函数时非常有用

super([arguments]); // calls the parent constructor. super.functionOnParent([arguments]);

扩展语句

允许一个表达式在原地展开，当需要多个参数 (比如函数调用时) 或者多个值(比如字面量数组) 。

var parts = ['shoulder', 'knees'];
var lyrics = ['head', ...parts, 'and', 'toes'];

扩展语句也可以用在函数调用的时候:

function f(x, y, z) { }
var args = [0, 1, 2];
f(...args);