-
JS组成
ECMAScript:js语法标准 DOM:JS操作网页 BOM:JS操作浏览器
JavaScript 的特点:
可以使用任何文本编辑工具编写,然后使用浏览器就可以执行程序。
是一种解释型脚本语言:代码不进行预编译,从上往下逐行执行,不需要进行严格的变量声明。
主要用来向 HTML 页面添加交互行为。 -
变量命名规则
变量名必须以字符或下划线“_”开头,不能以数字开头
变量可以包含数字、从 A 至 Z 的大小字母
不能使用 JavaScript 中的关键字做变量名
变量名不能有空格
严格区分大小写,比如:name 和 Name 就是两个完全不同的变量。
变量类型:Number String Boolean Array 数组 [] Object 对象 {}
多行注释 ctrl+shift+/ -
数字与运算符
数字类型
整数。例如:1,2,100,-10。
浮点数:就是小数。例如:0.2,3.1415926。
双精度:是一种特定类型的浮点数,它们具有比标准浮点数更高的精度。
注:我们这里作为了解就可以了。因为和其他语言不同的是,在 JavaScript 中,不管什么数字类型的通通用 var 声明就可以了,而且 JavaScript 中只有一个数据类型:Number。
num++ 其实是 num = num + 1 的省略写法
num++ 和 ++num 的区别,前者是先赋值再自增,后者是先自增再赋值
运算符的优先级
优先级从高到低
1.()优先级最高
2.一元运算符 ++ – !
3.算数运算符 先* / % 后 + -
4.关系运算符 > >= < < =
5.相等运算符 == != === !==
6.逻辑运算符 先&& 后|| -
数组概述:数组很多,定义很多var肯定是不行的,这时就需要数组
定义是由相同类型的元素(element)的集合所组成的数据结构,分配一块连续的内存来存储。利用元素的索引(index)可以计算出该元素对应的存储地址。
数组语法:
var array = new Array(1,2,3,4,5); //创建数组同时赋值
var array = [1,2,3,4,5]; //直接输入一个数组
我们可以用上述两种方法创建数组,array 指的是定义的数组名,可以自己取,arr[0];
数组储存的的数据可以是任何类型(数字,字符,布尔值等)。每一个值都有一个索引值,从 0 开始
var color = [“red”,“green”,“blue”,“yellow”];
color[0]; // returns “red”
color[1]; // returns “green”
color[2]; // returns “blue”
color[3]; // returns “yellow”
color[4]; // returns undefined
多维数组
多维数组就是数组中还包含数组,我们可以一层一层的来看。比如:
var student = [[“张三”,“男”,“18”],[“李四”,“女”,“20”]];
student[0][2]; // returns “18”修改数组中的元素内容也很简单,直接为它提供新值就可以了。比如:
var color = [“red”,“green”,“blue”,“yellow”];
color[0] = “black”;
color; // returns [“black”, “green”, “blue”, “yellow”]获取数组长度, 同样的我们使用 length 来获取数组的长度。比如:
var color = [“red”,“green”,“blue”,“yellow”];
color.length; // returns 4数组和字符串之间的转换
通过 split() 方法,将字符串转换为数组。比如:
“1:2:3:4”.split("? // returns [“1”, “2”, “3”, “4”]
“|a|b|c”.split("|") // returns ["", “a”, “b”, “c”]相反的我们通过 join() 方法将数组转换为字符串。比如:
[“1”, “2”, “3”, “4”].join("?; // returns “1:2:3:4”
["", “a”, “b”, “c”].join("|"); // returns “|a|b|c”
注:我们同样可以使用 toString() 方法将数组转换为字符串,但是 join() 方法可以指定不同的分隔符,而 toString() 方法只能是逗号。添加和删除数组项
在数组尾部添加一个或多个元素,使用 push() 方法。比如:
var arr = [“1”, “2”, “3”, “4”];
arr.push(“5”,“6”);
arr; // returns [“1”, “2”, “3”, “4”, “5”, “6”]使用 pop() 方法将删除数组的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不改变数组,然后返回 undefined 值。比如:
var arr = [“1”, “2”, “3”, “4”];
arr.pop(); //returns 4
arr; // returns [“1”, “2”, “3”]
var arr1 = [];
arr1.pop(); //returns undefined
arr1; //returns []
unshift() 和 shift() 从功能上与 push() 和 pop() 完全相同,只是它们分别作用于数组的开始,而不是结尾。Null 和 Undefined
null == 0 false
null == false false
0 == false true
undefined == 0 false
undefined == false false
undefined == null true
undefined == null true
undefined === null false这里需要说明的是:== 是相等操作符,比较值是否相等,如果相等输出为 true,否则为 false。
=== 是全等操作符,比较值和类型是否都相等,如果都相等输出为 true,否则为 false。
通过我们在控制台中的实践可以发现,null 和 undefined 的值不等于 0,它们的值相等,但是类型不相等。
undefined 表示所有没有赋值变量的默认值,而 null 则表示一个变量不再指向任何对象地址。 -
字符串
转义字符 \ 意味着我们对它们做一些事情,以确保它们在文本中被认可,而不是代码的一部分
var x1 = ‘I’ve got no right to take my place…’;-
连接字符串
我们通过 “+” 连接字符串,比如在控制台中输入下面的代码:
var one = “Hello,jack.”;
var two = “I’m rose”;
result = one + two; -
字符串转换
toString 方法把数字转换成字符串。
var myNum = 123;
var myString = myNum.toString();
typeof myString;
Number 对象把传递给它的字符串类型的数字转换为数字。
var myString = ‘123’;
var myNum = Number(myString);
typeof myNum;
注:如果传递的不是纯数字的字符串,则返回的不是数字,而是 NaN(not a number)。- 获取字符串的长度
通过 length 属性获取字符串的长度,结果返回一个数字。比如:
var myString = "hello world ";
myString.length;
上述代码在控制台中运行的结果为:12(除了字母还有两个空格)。
如果你要查找这个字符串的第一个字符,你可以这么做: myString[0];
同样也可以查找到其他的字符,比如第五个字符,就是 myString[4],这是因为电脑是从 0 开始,而不是 1,因此我们都要执行减一操作。- 在字符串中查找子字符串并提取它
有时候我们需要判断一个较长的字符串里面是否存在一个我们指定的较小的字符串,就比如我们要查找一段话里面是否包含一个词或者一个字,这个时候我们可以使用 indexof() 方法来完成,更详细的语法为:
str.indexOf(searchValue, fromIndex);
str 指的是我们需要查的较长的字符串,searchValue 表示我们指定的较小的字符串,fromIndex 表示调用该方法的字符串中开始查找的位置,是一个可选的任意整数值,也可以不写,默认是 0 表示从头开始查,fromIndex < 0 和 fromIndex = 0 是一样的效果,表示从头开始查找整个字符串。如果 fromIndex >= str.length,则该方法的返回值为 -1。这里有个特殊的情况:就是如果被查找的字符串(searchValue)是一个空字符串,那么当 fromIndex <= 0 时返回 0,0 < fromIndex <= str.length 时返回 fromIndex,fromIndex > str.length 时返回 str.length。这样说你可能不太明白,我们来实践一下看看实际效果:
“Blue Sky”.indexOf(“Blue”); // returns 0
“Blue Sky”.indexOf(“Ble”); // returns -1
“Blue Sky”.indexOf(“Sky”, 0); // returns 5
“Blue Sky”.indexOf(“Sky”, -1); // returns 5
“Blue Sky”.indexOf(“Sky”, 5); // returns 5
“Blue Sky”.indexOf(“Sky”, 9); // returns -1
“Blue Sky”.indexOf("", 0); // returns 0
“Blue Sky”.indexOf("", 5); // returns 5
“Blue Sky”.indexOf("", 9); // returns 8
注:返回值指的是指定值的第一次出现的索引,如果没有找到 -1。indexOf 方法区分大小写,比如:
“Blue Sky”.indexOf(“blue”); // returns -1
“Blue Sky”.indexOf(“Blue”); // returns 05)当你知道字符串中的子字符串开始的位置,以及想要结束的字符时,slice()方法可以用来提取 它。比如:
“Blue Sky”.slice(0,3); // returns “Blu”
明白了,就是从0开始,到3, 3那个字符不截取,截得是 0 1 2
注:slice(start,end),第一个参数 start 是开始提取的字符位置,第二个参数 end 是提取的最后一个字符的后一个位置。所以提取从第一个位置开始,直到但不包括最后一个位置。另外第二个参数也可以不写,不写代表某个字符之后提取字符串中的所有剩余字符。比如:
“Blue Sky”.slice(2); // returns “ue Sky”6)转换大小写
字符串方法 toLowerCase() 和 toUpperCase() 字符串并将所有字符分别转换为小写或大写。比如:
var string = “I like study”;
string.toLowerCase(); // returns “i like study”
string.toUpperCase(); // returns “I LIKE STUDY”7)替换字符串的某部分
可以使用 replace() 方法将字符串中的一个子字符串替换为另一个子字符串。比如:
var string = “I like study”;
string.replace(“study”,“sleep”); // returns “I like sleep” -
-
类型转换详解
转换字符串
1)几乎每个值都有 toString() 方法。比如在控制台输入以下代码:
var num = 8;
var numString = num.toString();
numString; // returns “8”
var result = true;
var resultString = result.toString();
resultString;// returns “true”数值类型的 toString() ,可以携带一个参数,输出对应进制的值。比如:
var num = 16;
console.log(num.toString()); //“16” 默认是10进制
console.log(num.toString(10));//“16”
console.log(num.toString(2)); //“10000”
console.log(num.toString(8)); //“20”
console.log(num.toString(16));//“10”2)String() 函数。比如在控制台中输入以下代码:
var num1 = 8;
var num2 = String(num1);
num2; // returns “8”
var result = true;
var result1 = String(result);
result1; // returns “true”
注:null.toString();这样写会报错;VM170:1 Uncaught TypeError: Cannot read property ‘toString’ of null
因为 null 和 undefined没有 toString() 方法,所以需要用 String()
String(null) “null”
String(undefined) “undefined”3)使用拼接字符串
var num1 = 16;
var num2 = num1 + “”;
num2; // returns “16”**转换成数值类型**
1.Number()可以把任意值转换成数值,如果要转换的字符串中有一个不是数值的字符,返回 NaN(not a number)
var num1 = Number(true);
num1; // true 返回 1,false 返回 0var num2 = Number(undefined); num2; // 返回 NaN var num3 = Number(null); num3; //返回 0 var num4 = Number("syl"); num4; // 返回 NaN var num5 = Number(" "); num5; // 如果是空字符串返回 0 var num6 = Number(123); num6; // 返回123,如果是数字型的字符,返回数字 var num7 = Number("123abc"); num7; // 返回 NaN
-
parseInt() 把字符串转换成整数
var num1 = parseInt(“12.3abc”);
num1; //返回 12,如果第一个字符是数字会解析知道遇到非数字结束,只取整,不是约等于var num2 = parseInt(“abc123”);
num2; //返回 NaN,如果第一个字符不是数字或者符号就返回 NaNvar num3 = parseInt("");
num3; // 空字符串返回 NaN,但是 Number("")返回 0var num4 = parseInt(“520”);
num4; //返回 520var num5 = parseInt(“0xA”);
num5; //返回 10
注,parseInt()可以传递两个参数,第一个参数是要转换的字符串,第二个参数是要转换的进制 -
parseFloat()把字符串转换成浮点数。写法和parseInt()相似,主要有以下几个不同点:
parseFloat不支持第二个参数,只能解析 10 进制数
如果解析的内容里只有整数,解析成整数
parseFloat(“10”); // returns 10
parseFloat(“10.000”); // returns 10
parseFloat(“10.01”); // returns 10.1
parseFloat(" 10 "); // returns 10
parseFloat(“10 hours”); // returns 10
parseFloat("aaa 10 "); // returns NaN -
执行减 0 操作
var n=“10”;
var m=n-0;
m; // returns 10
值得注意的是,如果该字符串不是纯粹的数字字符串,那么它执行减 0 操作后,虽然变成了一个数字类型,但是返回值为 NaN。比如:
var n = “abc”;
var m = n - 0;
m; // returns NaN
typeof(m); // returns “number”转换成布尔类型
1)使用 Boolean() 函数。比如:
Boolean(123);// returns true
Boolean(“abc”); // returns true
Boolean(null); // returns false
Boolean(undefined); // returns false
Boolean(NaN); // returns false
Boolean(0); // returns false
Boolean(""); // returns false
Boolean(false); // returns false
Boolean(“false”); // returns true
Boolean(-1); // returns true
2. 流程控制语句会把后面的值隐式转换为布尔类型。比如:
var message;
if(message) { //会自动把message转换成false,最后打印结果为:我很好
console.log("你好啊");
} else{
console.log("我很好");
}