2016年4月26日

[TOC]

2016年4月26日

javascript

对象

所谓对象，就是一种无序的数据集合，由若干个“键值对”（key-value）构成。 对象的所有键名都是字符串，所以加不加引号都可以。

  • 如果键名不符合标识名的条件（数字、空格或者运算符），也不是数字，则必须加上引号。

  • JavaScript的保留字可以不加引号当作键名。

  • 如果键名是数字，则会默认转为对应的字符串。

'1p': "Hello World",

for: 1,

1e2: true//100: true

对象生成

var o1 = {};
var o2 = new Object();
var o3 = Object.create(null);

操作属性

读取对象的属性，有两种方法，一种是使用点运算符，还有一种是使用方括号运算符。

var o = {
  p: 'Hello World'
};

o.p // "Hello World"
o['p'] // "Hello World"

如果使用方括号运算符，键名必须放在引号里面，否则会被当作变量处理。但是，数字键可以不加引号，因为会被当作字符串处理。

if(a) {...} // 报错

if(window.a) {...} // 不报错
if(window['a']) {...} // 不报错

if('a' in window) {//推荐 使用
  ...
}

所有全局变量都是window对象的属性。如果该属性不存在，就返回undefined，并不会报错。

查看所有属性

var o = {
  key1: 1,
  key2: 2
};

Object.keys(o);
// ['key1', 'key2']

删除属性

var o = {p: 1};
Object.keys(o) // ["p"]

delete o.p // true
o.p // undefined
Object.keys(o) // []

一旦使用delete命令删除某个属性，再读取该属性就会返回undefined，而且Object.keys方法返回的该对象的所有属性中，也将不再包括该属性。

对象的引用

如果不同的变量名指向同一个对象，那么它们都是这个对象的引用，也就是说指向同一个内存地址。修改其中一个变量，会影响到其他所有变量。

var o1 = {};
var o2 = o1;
//o1和o2指向同一个对象，因此为其中任何一个变量添加属性，另一个变量都可以读写该属性。
o1.a = 1;
o2.a // 1

o2.b = 2;
o1.b // 2
var o1 = {};
var o2 = o1;

o1 = 1;
o2 // {}

o1和o2指向同一个对象，然后o1的值变为1，这时不会对o2产生影响。

in运算符

in运算符用于检查对象是否包含某个属性（注意，检查的是键名，不是键值），如果包含就返回true，否则返回false。

var o = { p: 1 };
'p' in o // true

在JavaScript语言中，所有全局变量都是顶层对象（window）的属性。 in运算符的一个问题是，它不能识别对象继承的属性。

var o = new Object();
o.hasOwnProperty('toString') // false

'toString' in o // true

hasOwnProperty()函数用于指示一个对象自身(不包括原型链)是否具有指定名称的属性。

for…in循环

for...in循环用来遍历一个对象的全部属性。 for...in循环遍历的是对象所有可enumberable的属性，包括对象本身的属性，还包括对象继承的属性

// name 是 Person 本身的属性
function Person(name) {
  this.name = name;
}

// describe是Person.prototype的属性
Person.prototype.describe = function () {
  return 'Name: '+this.name;
};

var person = new Person('Jane');

// for...in循环会遍历实例自身的属性（name），
// 以及继承的属性（describe）
for (var key in person) {
  console.log(key);
}
// name
// describe

如果只想遍历对象本身的属性，可以使用hasOwnProperty方法:

for (var key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(key);
  }
}
// name

with语句

它的作用是操作同一个对象的多个属性时。

// 例一
with (o) {
  p1 = 1;
  p2 = 2;
}
// 等同于
o.p1 = 1;
o.p2 = 2;

// 例二
with (document.links[0]){
  console.log(href);
  console.log(title);
  console.log(style);
}
// 等同于
console.log(document.links[0].href);
console.log(document.links[0].title);
console.log(document.links[0].style);

with区块内部的变量，必须是当前对象已经存在的属性，否则会创造一个当前作用域的全局变量。

var o = {};

with (o) {
  x = "abc";
}

o.x // undefined
x // "abc"

数值

两个字符串进行比较时，按照字典顺序进行比较。 JavaScript引擎内部首先比较首字符的Unicode编号，如果相等，再比较第二个字符的Unicode编号，以此类推。

'cat' > 'Cat' // true'

小写的c的Unicode编号（99）大于大写的C的Unicode编号（67）。

同一类的复合类型值

两个复合类型（对象、数组、函数）的数据比较时，不是比较它们的值是否相等，而是比较它们是否指向同一个对象。

({}) === {} // false
[] === [] // false
(function (){}) === function (){} // false

严格相等运算比较的是它们的内存地址是否一样，而上面代码中空对象、空数组、空函数的值，都存放在不同的内存地址，结果当然是false。

相等运算符

  • 原始类型的值

    • 原始类型的数据会转换成数值类型再进行比较。

  • 对象与原始类型值比较

    • 对象（这里指广义的对象，包括数值和函数）与原始类型的值比较时，对象转化成原始类型的值，再进行比较。

[1] == 1 // true
[1] == '1' // true
[1] == true // true

上面代码将只含有数值1的数组与原始类型的值进行比较，数组[1]会被自动转换成数值1，因此结果都是true。

  • undefined和null

    • undefined和null与其他类型的值比较时，结果都为false，它们互相比较时结果为true。

  • 相等运算符的缺点

    • 相等运算符隐藏的类型转换，会带来一些违反直觉的结果。

'' == '0'           // false
0 == ''             // true
0 == '0'            // true

false == 'false'    // false
false == '0'        // true

false == undefined  // false
false == null       // false
null == undefined   // true

' \t\r\n ' == 0     // true

布尔运算符

取反运算符形式上是一个感叹号，用于将布尔值变为相反值。

以下六个值取反后为true：

!undefined // true
!null // true
!false // true
!0 // true
!NaN // true
!"" // true
!!x

// 等同于

Boolean(x)

且运算符（&&）

如果第一个运算子的布尔值为true，则返回第二个运算子的值（注意是值，不是布尔值）；如果第一个运算子的布尔值为false，则直接返回第一个运算子的值，且不再对第二个运算子求值。

"t" && "" // ""
"t" && "f" // "f"
"t" && (1+2) // 3
"" && "f" // ""
"" && "" // ""

且运算符可以多个连用，这时返回第一个布尔值为false的表达式的值。

或运算符（||）

如果第一个运算子的布尔值为true，则返回第一个运算子的值，且不再对第二个运算子求值；如果第一个运算子的布尔值为false，则返回第二个运算子的值。

"t" || "" // "t"
"t" || "f" // "t"
"" || "f" // "f"
"" || "" // ""

或运算符可以多个连用，这时返回第一个布尔值为true的表达式的值。

三元条件运算符（ ? :）

三元条件运算符用问号（？）和冒号（：），分隔三个表达式。如果第一个表达式的布尔值为true，则返回第二个表达式的值，否则返回第三个表达式的值。

"t" ? true : false // true

0 ? true : false // false

位运算

http://javascript.ruanyifeng.com/grammar/operator.html#toc14

圆括号运算符

圆括号是一种运算符，它有两种用法：如果把表达式放在圆括号之中，作用是求值；如果跟在函数的后面，作用是调用函数。

对象放在圆括号之中，则会返回对象的值，即对象本身。

var o = {p:1};

(o)
// Object {p: 1}

void运算符

void运算符的作用是执行一个表达式，然后不返回任何值，或者说返回undefined。

void运算符的优先性很高

<a href="javascript:void(f())">文字</a>

//下面的代码会提交表单，但是不会产生页面跳转。

<a href="javascript:void(document.form.submit())">
文字</a>

逗号运算符

逗号运算符用于对两个表达式求值，并返回后一个表达式的值。

"a", "b" // "b"

var x = 0;
var y = (x++, 10);
x // 1
y // 10

运算顺序

赋值运算符（=）和三元条件运算符（?:）是少数运算符的计算顺序是从右到左。

w = x = y = z;
q = a ? b : c ? d : e ? f : g;

w = (x = (y = z));
q = a ? b : (c ? d : (e ? f : g));

下表按从最高到最低的优先级列出JavaScript运算符。

运算符

描述

. [] ()

字段访问、数组下标、函数调用以及表达式分组

++ -- - ~ ! delete new typeof void

一元运算符、返回数据类型、对象创建、未定义值

* / %

乘法、除法、取模

+ - +

加法、减法、字符串连接

<< >> >>>

移位

< <= > >= instanceof

小于、小于等于、大于、大于等于、instanceof

== != === !==

等于、不等于、严格相等、非严格相等

&

按位与

^

按位异或

|

按位或

&&

逻辑与

||

逻辑或

?:

条件

= oP=

赋值、运算赋值

,

多重求值

Previous2016年4月25日Next2016年4月27日

Last updated

Was this helpful?