chapter1.2、JS基础语法
JS基础语法
注释
/** * 多行注释 */ //单行注释
常量和变量
标识符
标识符必须是字母、下划线、美元符号$和数字,但必须是字母、下划线、美元符号开头,依然是不能数字开头。
标识符区分大小写。
声明
var 声明一个变量
let 声明一个块作用域中的局部变量
const 声明一个常量
JS中的变量声明和初始化是可以分开的
var a //声明变量,此时a为undefined a = 100 //赋值 let b //声明变量,ES6开始支持,声明一个块作用域中的局部变量 b = 200 const c = 300 //声明常量,必须赋值,不能只写const,之后不能再改 z = 6 //不规范的初始化,不推荐,在严格模式下,会产生异常,在赋值前不能引用,一旦这样赋值就是全局作用域 console.log(3,a,b,c,z)
var会把变量提升到当前全局或函数作用域。
function hello(){ var a a = 100 } console.log(a) // 未声明变量,异常 // a = 200 // 不能提升声明 // let a = 200 //不能提升声明 console.log(b) // 不是未定义报错,而是返回undefined var b = 200 // 后执行赋值, var 声明提升hoisting
对于函数,只有函数声明会被提升到顶部,而不包括函数表达式。
/* 函数声明 */ foo() // 声明提升 function foo(){ console.log("bar") } /* 函数表达式 */ baz(); // 不进行声明提升,报TypEerror : baz is not a funtion var baz = function() { console.log("bar2") }
常量和变量的选择
如果明确知道一个标识符定义后不再修改,应该尽量声明成const常量,减少被修改的风险,减少Bug。
数据类型
number 数值型,包括整型和浮点型
boolean 布尔型,true和false
string 字符串
null 只有一个值null
undefined 变量声明未赋值的,对象为定义的属性
symbol ES6 新引入的类型
object 类型 是以上的基本类型的符合类型,是容器
ES是动态语言,弱类型语言
虽然先声明变量,但是变量可以重新赋值任何类型
//类型转换 console.log("========string++++++++") console.log(a = 3 + "hello", typeof(a)) //3hello string console.log(a = null + "hello", typeof(a)) //nullhello string console.log(a = undefined + "hello", typeof(a)) //undefinedhello string console.log(a = true + "hello", typeof(a)) //truehello string console.log("+++++++++number=======") console.log(a = null + 8, typeof(a)) //8 'number' console.log(a = undefined + 8, typeof(a)) //NaN 'number' undefined没法转换成对应的数字 console.log(a = true + 8, typeof(a)) //8 'number' console.log(a = false + 8, typeof(a)) //8 'number' console.log("+++++++++boolean=======") console.log(a = null + true, typeof(a)) // 1 'number' console.log(a = null + false, typeof(a)) //0 'number' console.log(a = undefined + true, typeof(a)) //NaN 'number' console.log(a = undefined + false, typeof(a)) //NaN 'number' //not a number console.log(a = null & true, typeof(a)) // 0 'number' // & 位与 console.log(a = undefined & true, typeof(a)) // 0 'number' //短路 console.log(a = null && true, typeof(a)) // 逻辑运算符, null直接就是false短路,返回null 'object' console.log(a = false && null, typeof(a)) // 逻辑运算符, false直接false短路,返回false "boolean" console.log(a = false && "hello", typeof(a)) // 返回false "boolean" console.log(a = true && "world", typeof(a)) // 返回world string console.log(a = true && "", typeof(a)) // 返回 string 空字符串 //null console.log("+++++++++null=======") console.log(a = null + undefined, typeof(a)) // NaN 'number'
弱类型语言会隐式类型转换,不需要强制类型转换。
NaN,即Not a Number,转换数字失败。它和任何值都不等,和自己也不等,只能使用Number.isNaN(NaN)
总结:
遇到字符串,加号就是拼接字符串,所有非字符串隐式转换为字符串。
如果没有字符串,加号把其他所有类型都当数字处理,非数字类型隐式转换为数字。undefined特殊,因为它都没有定义值,所以转换数字失败得到一个特殊值NaN。
&& and ,|| or , ~ 非
如果运算符是逻辑运算符,短路符,返回就是短路时的类型。没有隐式转换。
除非你十分明确,否则不要依赖隐式转换。写代码的时候,往往为了程序的健壮,请显式转换。
注意:以上的原则不要死记,忘了就实验,或者显示的类型转换
字符串
将一个值使用' 单引号或者 " 双引号 引用起来就是字符串
ES6提供了反引号定义一个字符串,可以支持多行,还支持插值。
let a = "abc" let b = "12138" let c = `line1 line2 line3 `//多行 console.log(c) //插值,要在反引号字符中,python3.6支持 let name = "jack", age = 101 console.log(`Hi,my name is ${name}. I'm ${age}`)
转义字符
\0 Null字节,空字符
\b 退格符
\f 换页符
\n 换行符
\r 回车符
\t Tab (制表符)
\v 垂直制表符
\' 单引号
\" 双引号
\ 反斜杠字符(\)
\XXX 由从0到377最多三位八进制数XXX表示的 Latin-1 字符。例如,\251是版权符号的八进制序列
\xXX 由从00和FF的两位十六进制数字XX表示的Latin-1字符。例如,\xA9是版权符号的十六进制序列
\uXXXX 由四位十六进制数字XXXX表示的Unicode字符。例如,\u00A9是版权符号的Unicode序列。见Unicode escape sequences (Unicode 转义字符)
\u{XXXXX} Unicode代码点 (code point) 转义字符。例如,\u{2F804} 相当于Unicode转义字符\uD87E\uDC04的简写
字符串操作方法
与python类似
let name = 'Riper' console.log(name.charAt(2)) // p console.log(name[2]) // p console.log(name.toUpperCase()) // RIPER console.log(name.concat('.com')) // Riper.com console.log(name.slice(2)) // 切片,支持负索引 per console.log(name.slice(2,5)) // per console.log(name.slice(-2, -1)) // e console.log(name.slice(-2)) // er let url = "www.riper.com" console.log(url.split('.')) // [ 'www', 'riper', 'com' ] console.log(url.substr(4,3)) // 返回子串从何处开始,取多长 rip console.log(url.substring(7,12)) // 返回子串,从何处开始,到什么为止 er.co let s = 'riper.tert' console.log(s.indexOf('er')) // 3 console.log(s.indexOf('er', 4)) // 7 console.log(s.replace('.tert', '.com')) // 替换完直接输出s s = ' \triper com \r\n' console.log(s.trim()) // 去除两端的空白字符。trimLeft、trimRight是非标函数,少用
数值型number
在JS中,数据均为双精度浮点型范围只能在 -(2^53 -1) 和 2^53 -1之间,整型也不例外。
数字类型还有三种符号值:+Infinity(正无穷)、-Infinity(负无穷)和 NaN (not-a-number非数字)。
二进制0b0010、0B110。
八进制0755。注意0855,将被认作十进制,因为8不在八进制中。ES6中最好使用0o前缀表示八进制。
十六进制0xAA、0Xff。
指数表示1E3(1000),2e-2(0.02)
常量属性
var biggestNum = Number.MAX_VALUE; // 最大 1.7976931348623157e+308 var smallestNum = Number.MIN_VALUE; //最小 5e-324 var infiniteNum = Number.POSITIVE_INFINITY; // +Infinity(正无穷) var negInfiniteNum = Number.NEGATIVE_INFINITY; // -Infinity(负无穷) var notANum = Number.NaN; // NaN (not-a-number非数字) console.log(biggestNum,smallestNum,infiniteNum,negInfiniteNum,notANum)
数字的方法
方法 描述
Number.parseFloat() 把字符串参数解析成浮点数,和全局方法 parseFloat() 作用一致
Number.parseInt() 把字符串解析成特定基数对应的整型数字,和全局方法 parseInt() 作用一致
Number.isFinite() 判断传递的值是否为有限数字
Number.isInteger() 判断传递的值是否为整数
Number.isNaN() 判断传递的值是否为 NaN
console.log( a = Number.parseInt("123d4e"), typeof(a)) // 123 "number" console.log( a = Number.parseFloat("2.2"), typeof(a)) // 2.2 "number" console.log( a = Number.isFinite(Number.NEGATIVE_INFINITY), typeof(a)) // false "boolean"
内置数学对象Math
Math提供了绝对值、对数指数运算、三角函数运算、最大值、最小值、随机数、开方等运算函数,提供了PI值
console.log(Math.PI) // 3.141592653589793 console.log(Math.abs(-1)) // 1 console.log(Math.log2(32)) // 5 console.log(Math.sqrt(9)) // 3 console.log(Math.random()) // (0, 1)之间的开区间 0.36634456552786165
运算符
算数运算符
+ - * / %
console.log(1/2) // 0.5自然除 console.log(1/0) // 无异常,返回无穷 console.log(5 % 3) // 2 console.log(parseInt(1/2)) // 0 取整,除法四舍五入 console.log(parseInt(3/2)) // 1 console.log(parseInt("5/10")) // 5 字符串不识别运算符。。 console.log(Math.floor(3/2)) // 1 向下 console.log(Math.ceil(3/2)) // 2 向上 console.log(Math.round(3/2)) // 2 四舍五入 console.log(Math.round(1/2)) // 1
++ 和 --
单目运算符,代表变量的自增,自减
i++ 先用再加 ,使用后再自增加1
++i i先自增,在使用i
++不如栈,效率比 i += 1 高,但是大部分解释语言在解释时会优化
let i = 0 let a = i++ console.log(a, i) // 0 1 console.log(a,i++) // 0 1 a = ++i console.log(a, ++i) // 3 4
C,C++,Java 的题目:
i = 0; let a = ++i+i+++i+++i; //等价于 let a = ++i + i++ + i++ + i console.log(a); // 7
单目运算符优先级高于双目运算符,单目是指运算的单位只有一位,比如++,双目是两位,比如+
比较运算符
逻辑运算符 注意短路,将经常判断的往前放
=== 恒等,推荐使用,出于安全性考虑,尽量使用,必须完全相等
!== 严格比较,必须完全不等
console.log(100 > '200') // false console.log(300 > '200') // true console.log(300 > '2000') // false console.log(3000 > '2a') // false console.log('3000' > '2000') // true // 宽松比较 console.log(300 == '300') // true console.log('200' == '200') // true // 严格比较 === console.log(300 === '300') // false console.log('200' === '200') // true
宽松比较会引起隐式类型转换,不好控制。
不要把不同的类型进行相比,么有意义。
建议使用严格比较,=== ,!==
逻辑运算符
&& || !与,或,非
console.log(0b10 && 0b01) // 1 console.log(0b10 || 0b01) // 2 console.log(!0b01, !0b00) // false true
支持短路,注意将经常进行比较的往前放
位运算
& | ^ ~ << >> 位与、位或、异或、取反、左移、右移,和Python一样
console.log((0b0111 & 0b0101).toString(2)) // 101 console.log((0b0111 | 0b0101).toString(2)) // 111 console.log((0b0111 ^ 0b0101).toString(2)) // 10 console.log(~0b0111, 0b0101>>1, 0b0101<<1) // -8 2 10
三元运算符
// 条件表达式?真值:假值 // 等价于简单的if...else结构: // if (条件表达式) { // 真值 // } // else { // 假值 // } console.log(a = 100>200 ? "true": "false") // false if(100>200){ var a = "ture1" } else{ var a = "false1" } console.log(a) // false1
三元运算符不要写两个以上,容易出错
逗号操作符
JS运行多个表达式写在一起
let a = 4+5, b = true, c=a > 20 ?'t':'f' console.log(a) //9 console.log(c) //f function test() { return a++, ++a, a++ } console.log(test()) // 11 console.log(a) // 12 s = (a=10, b=100, c = a > b ? "T": "F") console.log(s)
逗号优先级比等号还低,逗号表达式等于最后一次计算的值,
每一个表达式都有值,赋值表达式就是最后计算的值,逗号表达式就是最后的一个值
其他
instanceof 判断是否属于指定类型
typeof 返回类型字符串
delete delete操作符, 删除一个对象(an object)或一个对象的属性(an object's property)或者一个数组中某一个键值(an element at a specified index in an array)。
in 如果指定的属性在对象内,则返回true
console.log("a" instanceof String) //false console.log(1 instanceof Number) // false a = new String("b") console.log(a instanceof String) //true console.log(new Number(1) instanceof Number) // true console.log(a instanceof Object) //true console.log(typeof('a')) //string console.log(typeof 'a') //string console.log(typeof a) //object
instanceof 要求必须明确使用类型定义变量,就是对象必须是new关键字声明创建的。它可以用于继承关系的判断。
typeof就是返回对象的类型字符串。
delete 删除对象、属性、数组元素
x = 42; var y = 43; let z = 60; myobj = new Number(); myobj.h = 4; // create property h console.log(delete x); // returns true (can delete if declared implicitly) console.log(delete y); // returns false (cannot delete if declared with var) console.log(delete z); // returns false console.log(delete Math.PI); // returns false (cannot delete predefined properties) console.log(delete myobj.h); // returns true (can delete user-defined properties) console.log(delete myobj); // returns true (can delete if declared implicitly) console.log('~~~~~~~~~~~~~~~~~~~~') var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); for(var i=0;i<trees.length;i++) console.log(trees[i]) console.log('==================') delete trees[3]; // 数组中元素被删除,但空着的位置是undefined for(var i=0;i<trees.length;i++) console.log(trees[i])
in判断的是属性是否在对象内
let trees = new Array("redwood", "bay", "cedar", "oak", "maple"); console.log(0 in trees); // returns true ,0在数组对象的index中 console.log(3 in trees); // returns true ,3在数组对象的index中 console.log(6 in trees); // returns false,6不在数组对象的index中 console.log("bay" in trees); // return false,bay不是属性,它是值 console.log("length" in trees); // returns true,length是对象的属性 console.log('~~~~~~~~~~~~~~~~~~~~') delete trees[3]; console.log(3 in trees); // return false for(var i=0;i<trees.length;i++) console.log(trees[i]); console.log('~~~~~~~~~~~~~~~~~~~~') // Custom objects let mycar = { color: "red", year: 1998 }; console.log("color" in mycar); // returns true console.log("model" in mycar); // returns false console.log('year' in mycar) // true
运算符优先级
记不住,就多用括号
表达式
基本表达式,和python差不多
解析式也和python相似,但在ES6中非标,不推荐使用
生成器可以使用生成器函数,ES6开始支持
var和let定义的属性不可以删除,但是new的类和类下创建的类的属性可以,直接赋值的也可以删除
a