此文大部分为抄袭网上现有知识,这里只相当于提纲挈领的做个笔记,具体的可以参看菜鸟教程,上面写的比我详细的多。
一、Javascript数据类型
在 JavaScript 中有 6 种不同的数据类型:
- string
- number
- boolean
- object
- function
- symbol
3 种对象类型:
- Object
- Date
- Array
2 个不包含任何值的数据类型:
- null
- undefined
1.值类型(基本类型)
字符串(String)、数字(Number)、布尔(Boolean)、空(Null)、未定义(Undefined)、Symbol。
2.引用数据类型(对象类型)
对象(Object)、数组(Array)、函数(Function),还有两个特殊的对象:正则(RegExp)和日期(Date)。
3.JS动态类型(饱受诟病之处,被 Typescript 取代)
var x; // x 为 undefined
var x = 5; // 现在 x 为数字
var x = "John"; // 现在 x 为字符串
4.JavaScript 字符串
var carname="Volvo XC60";
var carname='Volvo XC60';
5.JavaScript 数字
var y=123e5; // 12300000
var z=123e-5; // 0.00123
var x1=34.00; //使用小数点来写
var x2=34; //不使用小数点来写
6.JavaScript 布尔
var x=true;
var y=false;
7.JavaScript 数组
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
var cars=new Array("Saab","Volvo","BMW");
var cars=["Saab","Volvo","BMW"];
8.JavaScript 对象
var person={
firstname : "John",
lastname : "Doe",
id : 5566
};
name=person.lastname;
name=person["lastname"];
9.声明变量类型
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
10.typeof 操作符
可以使用 typeof 操作符来查看 JavaScript 变量的数据类型。
typeof "John" // 返回 string
typeof 3.14 // 返回 number
typeof NaN // 返回 number
typeof false // 返回 boolean
typeof [1,2,3,4] // 返回 object
typeof {name:'John', age:34} // 返回 object
typeof new Date() // 返回 object
typeof function () {} // 返回 function
typeof myCar // 返回 undefined (如果 myCar 没有声明)
typeof null // 返回 object
11.进制变换
JavaScript中的多种进制与进制转换 - jimojianghu - 博客园
二、Javascript运算符
JavaScript 是一个脚本语言。它是一个轻量级,但功能强大的编程语言。
其语法与C/C++极为相似。暂且认为一样,遇到不一样再说。
关键字
abstract | else | instanceof | super |
boolean | enum | int | switch |
break | export | interface | synchronized |
byte | extends | let | this |
case | false | long | throw |
catch | final | native | throws |
char | finally | new | transient |
class | float | null | true |
const | for | package | try |
continue | function | private | typeof |
debugger | goto | protected | var |
default | if | public | void |
delete | implements | return | volatile |
do | import | short | while |
double | in | static | with |
语句标识符
break | 用于跳出循环。 |
catch | 语句块,在 try 语句块执行出错时执行 catch 语句块。 |
continue | 跳过循环中的一个迭代。 |
do ... while | 执行一个语句块,在条件语句为 true 时继续执行该语句块。 |
for | 在条件语句为 true 时,可以将代码块执行指定的次数。 |
for ... in | 用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。 |
function | 定义一个函数 |
if ... else | 用于基于不同的条件来执行不同的动作。 |
return | 退出函数 |
switch | 用于基于不同的条件来执行不同的动作。 |
throw | 抛出(生成)错误 。 |
try | 实现错误处理,与 catch 一同使用。 |
var | 声明一个变量。 |
while | 当条件语句为 true 时,执行语句块。 |
算术运算符
运算符 | 描述 | 例子 | x 运算结果 | y 运算结果 | 在线实例 |
---|---|---|---|---|---|
+ | 加法 | x=y+2 | 7 | 5 | 实例 » |
- | 减法 | x=y-2 | 3 | 5 | 实例 » |
* | 乘法 | x=y*2 | 10 | 5 | 实例 » |
/ | 除法 | x=y/2 | 2.5 | 5 | 实例 » |
% | 取模(余数) | x=y%2 | 1 | 5 | 实例 » |
++ | 自增 | x=++y | 6 | 6 | 实例 » |
x=y++ | 5 | 6 | 实例 » | ||
-- | 自减 | x=--y | 4 | 4 | 实例 » |
x=y-- | 5 | 4 | 实例 » |
赋值运算符
给定 x=10 和 y=5,下面的表格解释了赋值运算符:
运算符 | 例子 | 等同于 | 运算结果 | 在线实例 |
---|---|---|---|---|
= | x=y | x=5 | 实例 » | |
+= | x+=y | x=x+y | x=15 | 实例 » |
-= | x-=y | x=x-y | x=5 | 实例 » |
*= | x*=y | x=x*y | x=50 | 实例 » |
/= | x/=y | x=x/y | x=2 | 实例 » |
%= | x%=y | x=x%y | x=0 | 实例 » |
字符串的 + 运算符
txt1="What a very";
txt2="nice day";
txt3=txt1+txt2;
x=5+5;
y="5"+5;
z="Hello"+5;
规则:如果把数字与字符串相加,结果将成为字符串!
比较运算符
比较运算符在逻辑语句中使用,以测定变量或值是否相等。
x=5,下面的表格解释了比较运算符:
运算符 | 描述 | 比较 | 返回值 | 实例 |
---|---|---|---|---|
== | 等于 | x==8 | false | 实例 » |
x==5 | true | 实例 » | ||
=== | 绝对等于(值和类型均相等) | x==="5" | false | 实例 » |
x===5 | true | 实例 » | ||
!= | 不等于 | x!=8 | true | 实例 » |
!== | 不绝对等于(值和类型有一个不相等,或两个都不相等) | x!=="5" | true | 实例 » |
x!==5 | false | 实例 » | ||
> | 大于 | x>8 | false | 实例 » |
< | 小于 | x<8 | true | 实例 » |
>= | 大于或等于 | x>=8 | false | 实例 » |
<= | 小于或等于 | x<=8 | true | 实例 » |
逻辑运算符
逻辑运算符用于测定变量或值之间的逻辑。
给定 x=6 以及 y=3,下表解释了逻辑运算符:
运算符 | 描述 | 例子 |
---|---|---|
&& | and | (x < 10 && y > 1) 为 true |
|| | or | (x==5 || y==5) 为 false |
! | not | !(x==y) 为 true |
三、JavaScript 函数
三种写法
//带名称函数
function funname(parma1,param2){
//do something
}
//匿名函数写法1
function (param1,param2){
//do something
}
//匿名函数写法2
(param1,param2)=>{
//do something
}
四、Javascript 字符串操作
1.索引
字符串的索引从 0 开始,这意味着第一个字符索引值为 [0],第二个为 [1],以此类推。
2.引号
可以在字符串添加转义字符来使用引号,也可以使用不同的引号
var x = 'It\'s alright';
var y = "He is called \"Johnny\"";
var answer = "It's alright";
var answer = "He is called 'Johnny'";
var answer = 'He is called "Johnny"';
3.长度
使用内置属性 length 来计算字符串的长度:
var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
console.log(txt.length);
4.转义
代码 | 输出 |
---|---|
\' | 单引号 |
\" | 双引号 |
\\ | 反斜杠 |
\n | 换行 |
\r | 回车 |
\t | tab(制表符) |
\b | 退格符 |
\f | 换页符 |
5.对象还是字符串?
字符串可以是对象(陷阱!!一定要区分)
var x = "John";
var y = new String("John");
typeof x // 返回 String
typeof y // 返回 Object
6.字符串方法
harAt() | 返回指定索引位置的字符 |
charCodeAt() | 返回指定索引位置字符的 Unicode 值 |
concat() | 连接两个或多个字符串,返回连接后的字符串 |
fromCharCode() | 将 Unicode 转换为字符串 |
indexOf() | 返回字符串中检索指定字符第一次出现的位置 |
lastIndexOf() | 返回字符串中检索指定字符最后一次出现的位置 |
localeCompare() | 用本地特定的顺序来比较两个字符串 |
match() | 找到一个或多个正则表达式的匹配 |
replace() | 替换与正则表达式匹配的子串 |
search() | 检索与正则表达式相匹配的值 |
slice() | 提取字符串的片断,并在新的字符串中返回被提取的部分 |
split() | 把字符串分割为子字符串数组 |
substr() | 从起始索引号提取字符串中指定数目的字符 |
substring() | 提取字符串中两个指定的索引号之间的字符 |
toLocaleLowerCase() | 根据主机的语言环境把字符串转换为小写,只有几种语言(如土耳其语)具有地方特有的大小写映射 |
toLocaleUpperCase() | 根据主机的语言环境把字符串转换为大写,只有几种语言(如土耳其语)具有地方特有的大小写映射 |
toLowerCase() | 把字符串转换为小写 |
toString() | 返回字符串对象值 |
toUpperCase() | 把字符串转换为大写 |
trim() | 移除字符串首尾空白 |
valueOf() | 返回某个字符串对象的原始值 |
7.字符串模板
使用``符号(键盘1左边的按键),类似于格式化输出
let s1 = "fan";
let s2 = `hello ${s1}`;
console.log(s2);
8.正则表达式
正则表达式基础内容可以访问:正则表达式 - 教程。
JS正则表达式语法: /正则表达式主体/修饰符(可选)
修饰符 | 描述 |
---|---|
i | 执行对大小写不敏感的匹配。 |
g | 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。 |
m | 执行多行匹配。 |
在 JavaScript 中,正则表达式通常用于两个字符串方法 : search() 和 replace()。
search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串,并返回子串的起始位置。
replace() 方法用于在字符串中用一些字符串替换另一些字符串,或替换一个与正则表达式匹配的子串。
var str = "Visit Runoob!";
var n = str.search(/Runoob/i);
输出结果为:6
下面把microsoft 替换为 Runoob(microsoft 不区分大小写)
var str = document.getElementById("demo").innerHTML;
var txt = str.replace(/microsoft/i,"Runoob");
9. test()
test() 方法是一个正则表达式方法。
test() 方法用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回 true,否则返回 false。
下面例子判断val2是否全是字母
val2 = "asaaa"
var isletter2 = /^[a-zA-Z]+$/.test(val2);
console.log(isletter2);
10.exec()
exec() 方法是一个正则表达式方法。
exec() 方法用于检索字符串中的正则表达式的匹配。
该函数返回一个数组,其中存放匹配的结果。如果未找到匹配,则返回值为 null。
console.log(/life/.exec("The best things in life are free!"));
五、Javascript与JSON相互转换
1.什么是JSON
JSON 英文全称 JavaScript Object Notation,JSON 是一种轻量级的数据交换格式。
{"sites":[
{"name":"Runoob", "url":"www.runoob.com"},
{"name":"Google", "url":"www.google.com"},
{"name":"Taobao", "url":"www.taobao.com"}
]}
2.JSON转js对象
var text = '{ "sites" : [' +
'{ "name":"Runoob" , "url":"www.runoob.com" },' +
'{ "name":"Google" , "url":"www.google.com" },' +
'{ "name":"Taobao" , "url":"www.taobao.com" } ]}';
obj = JSON.parse(text);
console.log(obj);
3.相关函数
函数 | 描述 |
---|---|
JSON.parse() | 用于将一个 JSON 字符串转换为 JavaScript 对象。 |
JSON.stringify() | 用于将 JavaScript 值转换为 JSON 字符串。 |
六、Javascript数学操作
与其他全局对象不同的是,Math
不是一个构造器。Math
的所有属性与方法都是静态的。引用圆周率的写法是 Math.PI
,调用正余弦函数的写法是 Math.sin(x)
,x
是要传入的参数。Math
的常量是使用 JavaScript 中的全精度浮点数来定义的。
欧拉数,即自然对数的底数,约等于 2.718
。
2
的自然对数,约等于 0.693
。
10
的自然对数,约等于 2.303
。
以 2
为底的 E
的对数,约等于 1.443
。
以 10
为底的 E
的对数,约等于 0.434
。
圆周率,一个圆的周长和直径之比,约等于 3.14159
。
二分之一 ½ 的平方根,同时也是 2
的平方根的倒数 12,约等于 0.707
。
2
的平方根,约等于 1.414
。
返回一个数的绝对值。
返回一个数的反余弦值。
返回一个数的反双曲余弦值。
返回一个数的反正弦值。
返回一个数的反双曲正弦值。
返回一个数的反正切值。
返回一个数的反双曲正切值。
返回 y/x
的反正切值。
返回一个数的立方根。
返回大于一个数的最小整数,即一个数向上取整后的值。
返回一个 32 位整数的前导零的数量。
返回一个数的余弦值。
返回一个数的双曲余弦值。
返回欧拉常数的参数次方,E^x
,其中 x
为参数,E
是欧拉常数(2.718...,自然对数的底数)。
返回 exp(x) - 1
的值。
返回小于一个数的最大整数,即一个数向下取整后的值。
返回最接近一个数的单精度浮点型表示。
返回其所有参数平方和的平方根。
返回 32 位整数乘法的结果。
返回一个数的自然对数(㏒e,即 ㏑)。
返回一个数加 1 的和的自然对数(㏒e,即 ㏑)。
返回一个数以 10 为底数的对数。
返回一个数以 2 为底数的对数。
返回零到多个数值中最大值。
返回零到多个数值中最小值。
返回一个数的 y 次幂。
返回一个 0 到 1 之间的伪随机数。
返回四舍五入后的整数。
返回一个数的符号,得知一个数是正数、负数还是 0。
返回一个数的正弦值。
返回一个数的双曲正弦值。
返回一个数的平方根。
返回一个数的正切值。
返回一个数的双曲正切值。
返回字符串 "Math"
。
返回一个数的整数部分,直接去除其小数点及之后的部分。
需要注意的是,三角函数 sin()
、cos()
、tan()
、asin()
、acos()
、atan()
和 atan2()
返回的值是弧度而非角度。若要转换,弧度除以 (Math.PI / 180)
即可转换为角度,同理,角度乘以这个数则能转换为弧度。