- 首页 > it技术 > >
...
or
...
- 常用语法
if (2 > 1) {
x = 1;
y = 2;
z = 3;
}
- 和python类似,都是使用4空缩进
- // 单行注释, /* ... ... */ 为多行注释
- 严格区分大小写
- 数据类型和变量
- number
- 字符串: 字符串是以单引号'或双引号"括起来的任意文本
- 布尔值
true;
// 这是一个true值
false;
// 这是一个false值
2 > 1;
// 这是一个true值
2 >= 3;
// 这是一个false值
要特别注意相等运算符==。JavaScript在设计时,有两种比较运算符:
第一种是==比较,它会自动转换数据类型再比较,很多时候,会得到非常诡异的结果;
第二种是===比较,它不会自动转换数据类型,如果数据类型不一致,返回false,如果一致,再比较。
由于JavaScript这个设计缺陷,不要使用==比较,始终坚持使用===比较。另一个例外是NaN这个特殊的Number与所有其他值都不相等,包括它自己:
NaN === NaN;
// false
唯一能判断NaN的方法是通过isNaN()函数:
isNaN(NaN);
// trueJs 中有null和undefined,但是一般都统一用null
var arr = [1, 2, 3.14, 'Hello', null, true];
arr[0];
// 返回索引为0的元素,即1
arr[5];
// 返回索引为5的元素,即true
arr[6];
// 索引超出了范围,返回undefined
JavaScript的对象是一组由键-值组成的无序集合,例如:
var person = {
name: 'Bob',
age: 20,
tags: ['js', 'web', 'mobile'],
city: 'Beijing',
hasCar: true,
zipcode: null
};
JS中对象的键值都是字符串,采用 对象.属性 的方法获取对应的值person.name;
// 'Bob'
person.zipcode;
// null
- 变量
通过 var 来申明动态变量
- strict模式
js中不使用var就默认为全局变量,会导致多页面的相同变量冲突,所以加入了strict模式,强制使用var修饰'use strict';
多行字符串可以不采用\n来拼接,而是使用 `` 符号来连接
`这是一个
多行
字符串`;
var name = '小明';
var age = 20;
var message = '你好, ' + name + ', 你今年' + age + '岁了!';
alert(message);
var name = '小明';
var age = 20;
var message = `你好, ${name}, 你今年${age}岁了!`;
alert(message);
var s = 'Hello, world!';
s.length;
// 13var s = 'Hello, world!';
s[0];
// 'H'
s[6];
// ' '
s[7];
// 'w'
s[12];
// '!'
s[13];
// undefined 超出范围的索引不会报错,但一律返回undefined字符串按索引赋值不生效
var s = 'Test';
s[0] = 'X';
alert(s);
// s仍然为'Test's.toUpperCase();
s.toLowerCase();
var s = 'hello, world'
s.substring(0, 5);
// 从索引0开始到5(不包括5),返回'hello'
s.substring(7);
// 从索引7开始到结束,返回'world'
- 数组
==> length
var arr = [1, 2, 3.14, 'Hello', null, true];
arr.length;
// 6
修改length的值会改变数组的大小
var arr = [1, 2, 3];
arr.length;
// 3
arr.length = 6;
arr;
// arr变为[1, 2, 3, undefined, undefined, undefined]
arr.length = 2;
arr;
// arr变为[1, 2]通过索引修改值
var arr = ['A', 'B', 'C'];
arr[1] = 99;
arr;
// arr现在变为['A', 99, 'C']var arr = [1, 2, 3];
arr[5] = 'x';
arr;
// arr变为[1, 2, 3, undefined, undefined, 'x']==> indexOf
var arr = [10, 20, '30', 'xyz'];
arr.indexOf(10);
// 元素10的索引为0
arr.indexOf(20);
// 元素20的索引为1
arr.indexOf(30);
// 元素30没有找到,返回-1
arr.indexOf('30');
// 元素'30'的索引为2==> slice 对应String 的substring
var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(0, 3);
// 从索引0开始,到索引3结束,但不包括索引3: ['A', 'B', 'C']
arr.slice(3);
// 从索引3开始到结束: ['D', 'E', 'F', 'G']==> push和pop 对列表尾的增删操作
var arr = [1, 2];
arr.push('A', 'B');
// 返回Array新的长度: 4
arr;
// [1, 2, 'A', 'B']
arr.pop();
// pop()返回'B'
arr;
// [1, 2, 'A']
arr.pop();
arr.pop();
arr.pop();
// 连续pop 3次
arr;
// []
arr.pop();
// 空数组继续pop不会报错,而是返回undefined
arr;
// []==> unshift和shift 对列表头的增删操作
var arr = [1, 2];
arr.unshift('A', 'B');
// 返回Array新的长度: 4
arr;
// ['A', 'B', 1, 2]
arr.shift();
// 'A'
arr;
// ['B', 1, 2]
arr.shift();
arr.shift();
arr.shift();
// 连续shift 3次
arr;
// []
arr.shift();
// 空数组继续shift不会报错,而是返回undefined
arr;
// []==> sort
var arr = ['B', 'C', 'A'];
arr.sort();
arr;
// ['A', 'B', 'C']==> reverse
var arr = ['one', 'two', 'three'];
arr.reverse();
arr;
// ['three', 'two', 'one']==> splice
var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
// 从索引2开始删除3个元素,然后再添加两个元素:
arr.splice(2, 3, 'Google', 'Facebook');
// 返回删除的元素 ['Yahoo', 'AOL', 'Excite']
arr;
// ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']
// 只删除,不添加:
arr.splice(2, 2);
// ['Google', 'Facebook']
arr;
// ['Microsoft', 'Apple', 'Oracle']
// 只添加,不删除:
arr.splice(2, 0, 'Google', 'Facebook');
// 返回[],因为没有删除任何元素
arr;
// ['Microsoft', 'Apple', 'Google', 'Facebook', 'Oracle']==> concat
var arr = ['A', 'B', 'C'];
var added = arr.concat([1, 2, 3]);
added;
// ['A', 'B', 'C', 1, 2, 3]
arr;
// ['A', 'B', 'C']
请注意,concat()方法并没有修改当前Array,而是返回了一个新的Array。
实际上,concat()方法可以接收任意个元素和Array,并且自动把Array拆开,然后全部添加到新的Array里:
var arr = ['A', 'B', 'C'];
arr.concat(1, 2, [3, 4]);
// ['A', 'B', 'C', 1, 2, 3, 4]==> join
var arr = ['A', 'B', 'C', 1, 2, 3];
arr.join('-');
// 'A-B-C-1-2-3'
- 对象
var xiaoming = {
name: '小明',
birth: 1990,
school: 'No.1 Middle School',
height: 1.70,
weight: 65,
score: null
};
访问属性是通过.操作符完成的,但这要求属性名必须是一个有效的变量名。如果属性名包含特殊字符,就用''括起来
var xiaohong = {
name: '小红',
'middle-school': 'No.1 Middle School'
};
name 可以用 .name 和['name'] 来获取,但是middle-school就只能['middle-school']来获取,如果获取一个不存在的属性,得到的undefined而不是异常可以动态添加对象属性,也可以使用delete来删除属性
可以使用 in 来判断是否有属性存在,同时集成来的属性也有可能返回true
用hasOwnProperty()方法可以判断是否为自己的属性
- 【常用api】判断
var age = 3;
if (age >= 18) {
alert('adult');
} else if (age >= 6) {
alert('teenager');
} else {
alert('kid');
}
JavaScript把null、undefined、0、NaN和空字符串''视为false,其他值一概视为true
- 循环
var x = 0;
var i;
for (i=1;
i<=10000;
i++) {
x = x + i;
}
x;
// 50005000var x = 0;
for (;
;
) { // 将无限循环下去
if (x > 100) {
break;
// 通过if判断来退出循环
}
x ++;
}和 for ... in 写法
var o = {
name: 'Jack',
age: 20,
city: 'Beijing'
};
for (var key in o) {
console.log(key);
// 'name', 'age', 'city'
}var o = {
name: 'Jack',
age: 20,
city: 'Beijing'
};
for (var key in o) {
if (o.hasOwnProperty(key)) {
console.log(key);
// 'name', 'age', 'city'
}
}
请注意,for ... in对Array的循环得到的是String而不是Number
map 类似python的字典但是key可以为数字或其他类型,set为不重复的结合
var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]);
m.get('Michael');
// 95var m = new Map();
// 空Map
m.set('Adam', 67);
// 添加新的key-value
m.set('Bob', 59);
m.has('Adam');
// 是否存在key 'Adam': true
m.get('Adam');
// 67
m.delete('Adam');
// 删除key 'Adam'
m.get('Adam');
// undefined
你可能会有疑问,for ... of循环和for ... in循环有何区别
for ... in循环由于历史遗留问题,它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象,它的每个元素的索引被视为一个属性。var s = new Set(['A', 'B', 'C']);
s.forEach(function (element, sameElement, set) {
console.log(element);
});
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
m.forEach(function (value, key, map) {
console.log(value);
});
var a = ['A', 'B', 'C'];
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身
console.log(element + ', index = ' + index);
});
推荐阅读