Github: https://github.com/SHENLing0628/JavaScriptStudy
欢迎star,转载请标注来源
1. 语法
区分大小写
标识符:第一个字符必须是一个字母、下划线或一个美元符号;其他字符可以使字母、下划线、美元符号或数字。(惯例:驼峰法)
-
注释:
// 单行注释 /* * 多行块级注释 */
-
严格模式 strict mode
// 启用方法 // 1. 全局使用:顶部添加 "use strict" // 2. 局部使用:function内添加 function foo() { "use strict" // 函数体 }
-
语句
if (test) { test = false; alert(test); }
2. 变量
js中的变量为“松散类型”,即为可用来保存任何类型数据
var message = 'hi'
var message2 = 123
3. 数据类型
Undefined、Null、Boolead、Number、String、Object
-
typeof 操作符 - 检测变量类型
数据类型 typeOf 返回结果 未定义 "undefined" 布尔值 "boolean" 字符串 "string" 数值 "number" 对象或null "object" 函数 "function"
-
undefined 类型 - 声明但未赋值的变量
var message; alert(message); // 返回:undefined
-
Null类型 - 空对象指针
var message = null alert(typeof message) // 返回:object
-
Boolean类型 - True / False
// 强制转换 var message = 123 var message2 = Boolead(message) // 返回: true // 自动转换 if (message) { // 在控制语句中,自动驻安徽 alert('value is true') }
备注: true不一定等于1,false不一定等于0
-
Number类型
// 整数 var intNum = 10 // 八进制 - 以0开头,后面是八进制序列0~7 var octalNum = 077 // 十六进制 - 以Ox开头,后面是十六进制数字0~9 A~F var hexNum = 0x1f // 浮点值 var floatNum = 1.1 var floatNum2 = 3.125e7 // NaN - not a number 非数值 - 表示本应返回数值,但未能返回的情况,以避免抛出错误 var nanNum = NaN / 10; // 返回:NaN var nanNum2 = (NaN == NaN) // 返回: false - NaN与任何数值都不相等,包括其本身 var nanNum3 = isNaN(NaN) // 返回: true var nanNum4 = isNaN("blue") // 返回:true - blue不可能被转换为数值 var nanNum5 = isNaN(true) // 返回:false - true可以转换为数值1, 故不是NaN // 数值转换 - Number() - 复杂不合理 Number(true) // 1 Number(false) // 0 Number(10) // 10 Number(null) // 0 Number(undefined) //NaN Number('blue') // NaN Number('123') // 123 Number('1.1') // 1.1 Number('0xf') // 15 Number('') // 0 //数值转换 - parseInt() - 第一个参数为转换数据,第二个参数为解析进制基数 parseInt('1234blue') // 1234 parseInt('') // NaN parseInt('0xA') // 10 - 十六进制:转换为对应的十进制 parseInt(22.5) // 22 parseInt("070") // 56 - 八进制:转换为对应的十进制 parseInt("70") // 70 parseInt("AF", 16) // 175 - 按十六进制解析,此时前面无需添加0x
补充:
isNaN执行流程:
- 先调用
valueOf()
,确定其返回值是否可以转换为数值 - 再调用
toString()
,测试其返回值
- 先调用
-
String 类型
var name = "cindy" // 转换为字符串 - toString() - 可传参数:进制数 var num = 10 num.toString() // “10” num.toString(2) // “1010”
-
Object类型
var obj = new Object()
属性和方法 概念 constructor 保存用于创建当前对象的函数 hasOwnProperty(propertyName) 检查给定的属性在当前对象实例中是否存在
例如:obj.hasOwnProperty("name")isPrototypeof(object) 检查传入的对象是否是当前对象的原型 propertyIsEnumerable(propertyName) 检查给定的属性是否能够使用for-in语句来进行枚举 toLocaleString() 返回对象的字符串表示,该字符串与执行环境的地区对应 toString() 返回对象的字符串表示 valueOf() 返回对象的字符串、数值、布尔值表示。通常与toString()返回值相同
4. 操作符
-
一元操作符 - 只操作一个值的操作符
// 1. 递增和递减 - 类似C语言思想 // 1.1 前置型操作 var age = 29 ++age // 和 age = age + 1 效果相同 --age // 和 age = age - 1 效果相同 var anotherAge = --age + 2 alert(age) // 28 alert(anotherAge) // 30 // 1.2 后置型操作 var num1 = 2 var num2 = 20 var num3 = num1-- + num2 // 22 var num4 = num1 + num2 // 21 alert(num1) // 1 // 1.3 适用于其他数据类型 // 包含有效数字的字符串 - 先转换为数值变量,在执行加减操作 // 不包含有效数字的字符串 - 变量值设置为NaN // false -------------- 先转为0,再执行加减1 // true -------------- 先转为1,再执行加减1 // 浮点数 -------------- 直接执行加减1 // 对象 ---------------- 先调用valueOf()方法,获得可供操作的值,再操作;若为NaN,则再调用toString()后再应用前述规则 var s1 = "2" var s2 = "z" var b = false var f = 1.1 var obj = { valueOf: function() { return -1 } } s1++ // 3 s2++ // NaN s3++ // 1 f-- // 0.1 obj-- // -2 // 2. 一元加和减操作符 // 2.1 一元加操作符 - 不对数值本身产生影响,但会类似Number()一样对数值执行强制类型转换 var num = 25 num = +num // 25 // 2.2 一元减操作符 - 表示负数;对于非数值类型,先强制转换类型,再变为负数 num = -num // -25
-
位操作符 - 二进制 位计算
默认情况下,ECMAScript所有整数都是有符号整数。也存在无符号整数;
无符号整数 - 第32为不再表示符号,故可表示数值更大
// 1. NOT 按位非 ~ var num1 = 25 // 二进制 00000000000000000000000000011001 var num2 = ~num1 // 二进制 11111111111111111111111111100110 // 2. AND 按位与 & var result = 25 & 3 // 1 // 3. OR 按位或 | var result = 25 | 3 // 27 // 4. XOR 按位异或 ^ var result = 25 ^ 3 // 26 // 5. 左移 << (将数值所有位向左移动位数;且左移不影响符号位) var oldValue = 2 // 二进制 0000010 var newValue = oldValue << 5 // 二进制 1000000 十进制:64 // 6. 右移 // 6.1 有符号右移 - 保留符号位 >> var oldValue = 64 var newValue = oldValue >> 5 // 2 // 6.2 无符号右移 - 正数无影响,负数有变化 >>> var oldValue = -64 // 二进制 1111111111111111111111111111000000 var newValue = oldValue >>> 5 // 二进制 0000011111111111111111111111111110 十进制 134217726
-
布尔操作符
// 1. 逻辑非 ! !false // true !"blue" // false !0 // true !NaN // true !"" // true !12345 // false // 2. 逻辑与 && obj && true // true - 第一个是对象,则返回第二个操作数 true && obj // obj - 第二个是对象,则在第一个为true时,返回对象 obj1 && obj2 // obj2 - 两个都是对象,则返回第二个对象 null && true // null - 第一个是null,则返回null NaN && true // NaN - 第一个是NaN,则返回NaN udefined && true // undefined - 第一个是undefined,则返回undefined // 3. 逻辑或 || obj || true // obj - 第一个是对象,则返回第一个操作数;但第一个obj求职结果为false,则返回第二个 obj1 || obj2 // obj1 - 两个都是对象,则返回第一个对象 null || null // null - 两个都是null,则返回null NaN || NaN // NaN - 两个都是NaN,则返回NaN udefined || udefined // undefined - 两个都是undefined,则返回undefined
-
乘性操作符 - 乘法、除法和求模
// 1. 乘法 - 乘积超过数值范围,则返回Infinity或-Infinity var result = 34 * 56 NaN * 10 // NaN Infinity * 0 // NaN Infinity * 12 // Infinity Infinity * -12 // -Infinity Infinity * Infinity // Infinity // 2. 除法 - 商超过数值范围,则返回Infinity或-Infinity;特殊情况类似上述乘法 var result = 66 / 11 // 3. 求模 - 求余数;特殊情况类似上述乘法 var result = 26 % 5 // 1
-
加性操作符
// 1. 加法 var result = 1 + 2 NaN + 1 // NaN Infinity + Infinity // Infinity (-Infinity) + (-Infinity) // -Infinity Infinity + (-Infinity) //NaN (+0) + (+0) // +0 (-0) + (-0) // -0 (+0) + (-0) // +0 // 2. 减法 var result = 2 - 1 NaN - 1 // NaN Infinity - Infinity // NaN (-Infinity) - (-Infinity) // NaN Infinity - (-Infinity) // Infinity (-Infinity) - Infinity // -Infinity (+0) - (+0) // +0 (-0) - (+0) // -0 (-0) - (-0) // +0
-
关系操作符 - 大于、小于、小于等于、大于等于
5 > 4 // true 5 < 3 // false "Brick" < "alphabet" // true - 均为字符串,比较字符编码值 "23" < 3 // false - 一个为字符串,则将其转为数值后比较 NaN < 3 // false NaN >= 3 // false // 补充:如果一个操作数是对象,则调用其valueOf()方法,如果没有valueOf()方法,则通过toString()处理后比较
-
相等操作符
相等不相等 - 先转换再比较
全等不全等 - 仅比较而不转换
// 1. 相等不相等 - 会产生强制转换类型 null == undefined // true - null和undefined相等 "NaN" == NaN // false - 只要一个为NaN,则返回false 5 == NaN // false NaN == NaN // false NaN != NaN // true false == 0 // true - 对false强制转型为0 true == 1 // true - 对true强制转型为1 true == 2 // false undefined == 0 // false null = 0 // false "5" == 5 // true - 对"5"强制转型为数值5 // 全等不全等 - 在两个操作数未经转换就像等的情况下返回true null === undefined // false "55" === 55 // false
-
条件操作符
variable = boolean_expression ? true_value : false_value
-
赋值操作符
var num = 25 num += 10 // 等同于:num = num + 10 num *= 10 num /= 5 num %= 3 num += 1 num -= 1 num <<= 2 num >>= 2 nun >>>= 2
-
5. 语句
-
if语句
if (condition1) { // statement1 } else if (condition2) { // statement2 } else { // statement3 }
-
do-while
// 先执行,再判断 do { // statement } while(condition)
-
while
// 先判断,再执行 while(condition) { // statement }
-
for
var count = 10 for (var i = 0; i < count; i++) { // statement } // 类似while for (; i < count; i++) { // statement } // 无限循环 for (;;) { // statement }
-
for-in
// 用于枚举对象属性 for (property in expression) { // statement }
-
label
// 用户在代码中添加标签 label: statement // example - start标签可同break和continue配合使用 start: for (var i = 0; i < count; i++) { alert(i) }
-
break和continue
break - 立即退出循环
Continue - 立即退出当前循环,但还会执行下一次循环
-
with
// 将代码的作用域设置到特定对象中 with (expression) statement // example - 将包含location对象的变量声明赋值放一起 with(location) { var qs = search.substring(1) var hostname = hostname var url = href } // 常规写法: var qs = location.search.substring(1) var hostname = location.hostname var url = location.href
-
switch
switch(expression) { case value1: statement1; break case value2: statement2; break case value3: statement3; break default: break }
6. 函数 - function
-
基本语法
// 声明函数 function funName (arg0, arg1, ... , argN) { //statements } // 调用函数 funName('say hi')
注意事项:
如果statements中,使用return,则return之后的语句不会执行
-
严格模式对function的限制:
函数名不能命名为eval或arguments
参数不能命名为eval或arguments
不能出现两个命名参数同名的情况
-
理解参数 - arguments
-
function中传入参数可不必非要声明,可以使用arguments对象来获取,不显式地使用命名参数
function sayHi() { alert("Hello " + arguments[0] + ',' + arguments[1]) }
arguments对象类似Array的调用方式,但并非Array的实例
-
function中传入的参数数量可不必与声明的参数个数一致,因为在function内部都是以数组形式获取参数值的
function sayHi (name1, name2) { alert("Hello " + name1 + ',' + name2) } sayHi('Alice') sayHi('Alice', 'Bob') sayHi('Alice', 'Bob', 'Clair') // 注意:arguments[0]和name1是对应的,值是一样的
-
arguments也具有length属性,以获得参数的个数
function argLength() { alert(arguments.length) } argLength('arg1', 'arg2')
ECMAScript中所有参数传递都是值,而不能通过引用传递参数
-
-
没有重载
后定义的函数会覆盖之前名称相同的函数。而并不能有java的重载的效果
function foo(num) { return num + 100 } function foo(num) { return num + 200 } var result = foo(100) //300
Github: https://github.com/SHENLing0628/JavaScriptStudy
欢迎star,转载请标注来源