1、JS基础语法格式:
1、javaScript语法要写在script标签中,或这在js文件中.
2、script属于常规标签,有起始标签及闭合标签.
3、注:使用script标签写js语法时,标明该script的类型为type=“text/javascript”.
2、展示类型语句:
1、在控制台的输出语句:
console.log("要输出的内容");
注:在控制台输出语句中,标签为普通字符
2、网页弹出信息alert
alert("牛郎")
注:在alert语句中,标签为普通字符
3、在网页展示内容
document。write()
注:在document。write语句中,正确标签会被解析
3、基本数据类型及命名规则
一、基本数据类型:
1、Number:数字类型 整型 浮点型
2、String:字符串
3、Boolean:true false
4、null:空值类型 null
5、undefined:未定义类型 undefined
当变量仅声明未赋值时,系统默认赋予一个初始值undefined,该变量的类型为undefined类型。
当变量声明并未赋予初始值为null时,该变量的类型为null类型,值为null。
二、引用数据类型
1、String:字符串
2、Array:数组---python中的list
三、标识符命名规则:
1、由数字、字母、下划线、$符号组成
2、不能以数字开头
3、区分大小写
4、如果名称中有$符号,一般建议$符号出现在名称的最前面
5、不能是js的关键字
6、见名知义
4、声明变量及常量
1、声明变量:
语法格式:
var 变量名称;
变量的赋值:
变量名称 = 常量或表达式;
简写:变量的声明及赋值写在一起
var 变量名称 = 常量或表达式
2、查看变量或常量的数据类型
typeof 变量或常量
3、声明常量:
语法格式:
const 常量名称 = 常量或表达式
5、Number类型
1、声明一个undefined类型的变量
var num1;
console.log(num1);
2、声明一个number类型的变量,赋值类型为整型
var num2 = 100;
console.log(num2);
3、声明一个number类型的变量,赋值类型为浮点型
var num3 = 8.8;
console.log(num3)
4、声明八进制数
js中的八进制以0开头
var num4 = 012;
console.log(num4)
5、声明十六进制数
js中的十六进制以0x开头
var num5 = 0x1a;
console.log(num5);
6、js中能处理的最大数值为:1e308
Infinity:为特殊的number类型,当超出js能够处理的数值范围时,返回Infinity。
7、两个Infinity进行运算,返回NaN
NaN:not a number
NaN:属于number类型中的一种特殊类型
当运算符使用错误会返回NaN
NaN与任何数字进行运算,返回NaN
6、Boolean类型
布尔类型
数据类型:boolean
值:true false
js中为假的情况:
1、布尔值:false
2、空值:null
3、未定义:undefined
4、数字:0 0.0 NaN
5、字符串:'' "" 空字符串
除了以上情况,全为真
7、String字符串类型
一、基本数据累心字符串 string
1、定义:直接给变量赋值为 单引号或双引号引起来的字符
2、字符串的操作
⑴、字符串拼接 string + string
console.log("abc" + "def");
⑵、number + string
在js中,只要+两侧有一个类型为string,系统默认将另一边的类型转为string,并进行字符串拼接。
二、引用数据类型字符串
1、定义:
语法格式:
new String(“字符串”)
new:创建一个对象 new为js中的关键字
String:类名
String():执行构造函数
⑴、定义一个空字符串
var str1 = new String();
console.log(str1);
⑵、定义一个带有字符的字符串
var str2 = new String("asd132");
console.log(str2);
三、字符串是不可变的数据类型,字符串常量是不可变的
var str3 = "abc";
console.log(str3);
str3 = "def";
console.log(str3);
变的是声明的变量
四、字符换的相关方法
字符串的相关方法本身为引用类型的方法
string:基本数据类型
object:引用数据类型
但在使用相关方法期间,系统会将基本数据类型转换为引用数据类型去调用并执行相关方法
8、String操作
1、获取字符串长度length 属性
var str1 = "我是天使";
var str2 = new String("脸先落地的");
console。log(str1.length); 4
console。log(str2.length); 5
2、大小写转换
var str3 = "abcDEF";
转为小写
console.log(str3.toLowerCase());
转为大写
console.log(str8.toUpperCase());
3、字符串比较
str.localeCompare(str1):比较str及str1的大小:相等返回0,str大返回1,str小返回-1.
var str1 = 1;
var str2 = 2;
var result = str1.localeCompare(str2);
console.log(result);
4、比较相等
==:值相等 不考虑数据类型,只判断值是否相等
!=:值不相等
===:绝对相等 判断值及数据类型是否相等
!==:绝对不相等
5、获取字符串中某个字符
var str1 = “abc”;
⑴、下标 str[index]
console.log(str1[0]);
在js中下标越界不会报错,返回undefined
console.log(str1[9]); undefined
⑵、str.charAt(index)
console.log(str1.charAt(1));
在js中下标越界不会报错,返回空
console.log(str1.charAt(9));
6、将字符转为ASCII
str.charCodeAt(index)
console.log(str1.charCodeAt(1));
7、将ASCII转为字符串
String.fromCharCode(asc的值)
consoele.log(String.fromCharCode(65));
8、字符串切割
ste.splite(字符串/正则表达式)
var str1 = "today is thru third ";
console.log(str1.splitr(""));
使用正则表达式进行切割
consoele.log(str14.split(/+/));
9、将数组的元素拼接为一个字符串
join(字符串):使用字符串将数组中的元素拼接到一起
var arr1 = ["a","b","c"];
console.log(arr1.join("**"));
10、字符串替换
str.replace(旧的字符串/正则表达式,新的字符串)
当第一个参数为字符串时,默认只替换一次;如果想要全部替换,需要使用正则表达式。
var str1 = "good well good nice good";
console.log(str1.replace("good","bad"));
使用正则
console.log(str1.replace(/good/g,"bad"));
11、字符串查找
indexOf:当找到返回第一次找到的下标,当找不到时,返回-1,从左向右查找。
var str1 = "123asd456asd789asd";
console.log(str1.indexOf("asd"));
lastIndexOf:当找到返回第一次找到的下标,当找不到时,返回-1,从右向左查找。
var str1 = "123asd456asd789asd";
console.log(str1.lastIndexOf("asd"));
12、字符串截取
var str1 = "123asd456asd789asd";
substring(a,b):a,b均为下标,表示从a开始,截取到下标b(不包含下标b)
如果只有参数a,从a下标开始截取,截取到字符串末尾
console.log(str1.substring(2,4));
console.log(str1.substring(2));
substr(start,length):表示从start下标开始截取,截取length个字符长度
console.log(str1.substr(2,4));
9、赋值运算符
赋值运算符 =
复合赋值运算符 += -= *= /= %=
10、数学运算符
基本数学运算符:+ - * /
1、当符号两侧都为number时,进行数学运算
2、number与boolean进行数学运算
系统会自动将boolean类型转为number进行数学运算,true为1 false为0
3、number与nul进行数学运算
系统会自动将null类型转为number进行数学运算, null为0
4、number与undefined进行数学运算符
系统会自动将undefined类型转为number进行数学运算,undefined-->NaN
5、number与string进行数学运算
系统会自动将string类型转为number进行数学运算
当进行加法运算时,执行字符串拼接功能
当进行减、乘、除、余,会将string类型转为number进行数学运算,当string为非数字的字符串时,会转为NaN
11、比较运算符
比较运算符:> < >= <= == != === !==
返回boolean类型的数据
会自动进行数据类型转换
12、逻辑运算符
python: and or not
js: && || !
逻辑与:&& 当条件全部为真时,才为真
逻辑或:|| 当条件有一个为真,就为真
逻辑非:将原本的结论取反
短路运算符:
优点:如果根据第一个条件就能得出整体结论,第二个条件忽略不会进行运算,提高运行效率
13、自增自减运算符
自增运算符:
前自增:++变量 将自己本身的值加1,再使用
后自增:变量++ 先使用,再将自己本身的值加1
自减运算符:
前自减:--变量 将自己本身的值减1,再使用
后自减:变量-- 先使用,再将自己本身减1
14、提示框类型
alert:只有一个确定按钮 只做提示使用
alert("是否缴费或订阅?");
confirm:有确定及取消两个按钮
有返回值,当点击确定按钮,返回true,当点击取消按钮,返回false
prompt:有一个输入框,有确定及取消两个按钮
有返回值,当点击确定按钮,返回输入框中的文字,当点击取消按钮,返回null
15、类型转换
一、转为number类型
1、语法格式:Number(其他数据类型的变量)
a、将boolean转为number
true -> 1 false -> 0
b、将null转为number
null -> 0
c、将undefined转为number
undefined -> NaN
d、将string转为number
"123" 123
"+123" 123
"-123" -123
"1.23" 1.23
"" 0
" " 0
" 123" 123
"12 3" NaN
"123abc" NaN
"abc" NaN
"12@3" NaN
"1.2.3" NaN
二、转为string类型
语法格式一:String(数据)
语法格式一:toString(数据)
三、转为boolean类型
语法格式:boolean(数据)
条件语句
1、if语句
if语句:
语法格式:
if(条件:真或假){
语句;
}
if-else语句:
语法格式:
if(条件:真或假){
语句1;
}else{
语句2;
}
if-else if-else语句:
语法格式:
if(条件1:真或假){
语句1;
}else if(条件2:真或假){
语句2;
}else{
语句n
}
2、三目运算符
一元运算符:! + -(正负号)
二元运算符: + = &&...
三元运算符:?:
语法格式:
表达式?结论1:结论2
逻辑关系:当表达式为真时,返回结论1,当表达式为假时,返回结论2
优点:比if-else语句的运行效率高
缺点:结论语句不能太过复杂,应该为最终的结论
var a = 20;
var b = a == 10 ? 100 : 200;
alert(b); //200
3、switch语句
switch语句:
语法格式:
switch(表达式){
case 结论1:
语句1;
break;
case 结论2:
语句2;
break;
default:
语句n+1;
break;
}
逻辑关系:去判断表达式的值与哪一个case后面的结论相等,相等则执行相应case后面的语句,如果所有case后面的结论都与表达式不匹配,则执行default语句
break语句可以不写
default语句可以不写
所有的switch语句都能转为if-else语句,几乎80%的if-else语句都可以转为switch
break:中断switch语句,如果case后面的语句中无break,则从成功 匹配到的case语句开始执行,知道执行break语句才结束
循环语句
while语句
while语句:
语法格式:
while(条件语句){
语句;
}
注:while如果不是死循环,一定要在循环语句中存在更改判断条件的语句
do-while语句
do-while语句
语法格式:
do{
语句;
}while(条件语句)
while与do-while的区别:do里面的语句至少执行一次
while:先判断条件,再执行语句
do-while:先执行一次do语句,再进行判断,根据条件判断do的语句是否再次执行
for循环
for
语法格式:
for(初始条件语句;判断条件语句;更改条件语句){
语句;
}
for in 循环
for in
语法格式:
for(变量 in 数组){
语句;
}
注:变量为数组的下标
一般for-in会用于遍历数组
break&continue语句
break:终止循环
continue:中断本次循环
break与continue后面没有循环标识,默认终止或中断离它最近的那层循环
break与continue后面有循环标识,终止或中断相应标识符名称的循环
labelI:for(var i = 0;i<5;i++){
labelJ:for(var j = 0;j<5;j++){
if(j==1){
break labelJ;
}
console.log("i="+i+""+"j"+j);
}
}
函数
函数基本概念
函数的定义:
语法格式:
function 函数名(参数列表){
函数语句;
return 表达式;
}
1、function:定义函数的关键字,函数的代码块以function关键字开始
2、函数名:该函数在调用时的名称,命名规则遵循标识符的命名规则,匿名函数时,函数名忽略不写
3、():参数列表的开始与结束,如果没有参数,小括号不能省略
4、参数列表:格式:(参数1,参数2,..参数n)传入函数的参数用,隔开
该参数在函数定义中叫做形参(形式参数),类似变量名称
5、{}:函数体中的内容以{开始,}结束
6、函数语句:该函数封装的功能模块
7、return:一般用于函数的结束,将信息返回给函数的调用者
8、表达式:即将返回给函数的调用者的信息
注:函数最后return表达式可以省略,默认为return undefined
注:函数仅定义,未调用时,该函数不会被执行
函数的调用:
语法格式:
函数名(参数列表);
1、函数名:要执行的函数名称
2、():参数列表的开始于结束,如果没有参数,小括号不能省略
3、参数列表:格式:(参数1,参数2...参数n)传入的参数用,隔开
该参数在函数调用中叫做实参(实际参数),类似常量
函数调用的本质:将实参传递给形参赋值的过程
匿名函数
匿名函数:声明函数时,无函数名
匿名函数:如果不执行或无变量接收,程序认为语法错误
使用变量接收匿名函数:
var a = function(){
console.log("hello byebye");
}
立即执行函数
一般匿名函数只做一次性函数使用,声明后立即执行即可
立即执行函数:声明完成后,立即执行该函数
(function(num){
console.log(num1);
})("明天希望不下雨")
数组
创建数组
1、数组:将一组数据放到集合中,一个有序的集合
2、数组中数据类型可以不同
一、字面量创建数组
1、创建一个空数组
var arr1 = [];
console.log(arr1);
2、创建一个带有元素的数组
不同的元素之间用,隔开
var arr2 = [1,"b",true,null];
console.log(arr2);
二、使用Array类创建数组
1、创建空数组
var arr3 = new Array();
console.log(arr3);
2、创建一个长度为6的数组,元素为空
var arr4 = new Array(6);
console.log(arr4);
3、创建一个带有元素的数组
var arr5 = new Array("3",2,true,null);
console.log(arr5);
访问及修改数组元素
1、元素的访问
取值:arr[下标]
console.log(arr1[2]);
更改数据:arr[下标] = 新值
arr1[0] = 200;
下标越界:在js中不会报错,请注意下标,如果越界,返回undefined
2、获取元素个数 length
3、通过下标方式修改元素个数
不连续增加,没有赋值的下标会用undefined补全空白元素
4、删除数组的元素
使用delete删除的元素,该位置使用undefined补全
数组相关的方法
1、向数组末尾增加元素 push
arr.push(5);
2、移除数组末尾的元素 pop
arr.pop();
3、向数组开头增加元素 unshift
arr.unshift(1);
4、移除第一个元素
arr.shift();
5、将数组中的元素拼接为一个字符串 join
返回值为字符串类型的数据
var arr = ["a","b","c"];
console.log(arr.join("*"));
6、数组排序 sort 按照ASCII排序
arr.sort();
7、数组反转 reverse
arr.reverse();
8、查找是否存在某个元素 indexOf
如果找到,返回第一次找到的下标;
如果找不到,返回-1,从左向右找
var arr6 = [9,8,7,6,5,4,3];
var re1 =arr6.indexOf(8);
9、查找是否存在某个元素 lastIndexOf
如果找到,返回第一次找到的下标;
如果找不到,返回-1,从右向左找
var re2 = arr6.lastIndexOf(7);
10、数组截取 slice(beginIndex,endIndex)
返回一个新的数组,从beginIndex下标开始截取,截取到endIndex(不包含endIndex)
slice对原数组无影响
var re3 = arr6.slice(3,6);
11、增加、删除、修改数组元素 splice[index,count,[iten1,iten2...]]
splice对原数组有影响
index:从第几个下标开始
count:几个元素
item1,item2:增加或替换的元素