1.1引入js
方式一:
<Script> 在HTML内部使用
在该标签中放入我的JS代码
</Script>
方式二:<Script src="文件名.js"></Script>
1.2
基本语法:
<Script>
//1.定义变量 变量类型 变量名=变量值
Var num=1;
alert(num);//使用弹窗将num的值显示出来
//2.条件控制
var score =1;
if(score>60&&score<70){
alert("提示信息");
}else if(score>70&&score<80){
alert("提示信息");
}else{
alert("提示信息");
}
console.log(score); // 在浏览器控制台打印变量
1.3
比较运算符:
= 赋值
== 等于(值同类型不同true)
=== 绝对等于(类同,值也相同)
须知NAN这个与所有的数值都不相等,只能通过is NAN(NAN)来判断是否是NAN
浮点数:尽量避免使用浮点数运算,存在精度问题
null和undefined区别
1.null是空
2.undefind是未经定义
数组:JS中不需要类型相同:
例:var arr=[1,2,3,4,"sjdjhs",null,ture];
数组下标越界是undefined
对象:对象是大括号,数组是中括号,每个属性之间用逗号隔开,最后一个不需要加逗号
var person={
name:“sjdksj”,
age:30,
tags:['k','d','y',.....]
}
在控制台使用person.name则可显示属性值
}
严格检查模式:在使用这个模式下的JS语句将会有严格的要求
2.数据类型
2.1字符串:
1.正常字符串使用,单引号,或者双引号包裹。
2.注意转义字符\
3.多行字符串编写
// tab键上面,esc键下面
var msg=`hellow worlds 你好
世界`;
4.模板字符串
// tab键上面,esc键下面
let name="qing";
let msg=`你好呀,${name}`;
输出结果:你好呀,qing
5.字符串的长度
字符串名.length
6.字符串是不可变的
7.大小写转换
字符串名.toUppercase(); 转成大写
字符串名.toLowercase();转成小写
8.字符串名.indexof('t'); 找指定字符在字符串中的位置
9.字符串名.substring(1); 从第一个位置截取到最后一个位置
字符串名.substring(1,3); //范围是[1,3)
2.2数组
Array 可以包含任意的数据类型
var arr=[1,2,3,4,5,6] //可以通过下标取值和赋值
1.长度
arr.length
注:加入给arr.length赋值,数组大小会改变,如果赋值过小,元素就会丢失
arr.length=10;
2.indexof(),寻找指定元素在数组中的下标索引
数组名.index();
字符串“1”和数字1是不同的
3.slice() 截取Array的一部分,返回一个新的数组类似于substriing();
4.push,pop(尾)
数组名.push(‘ ’,' '); 压入数组
数组名.pop 弹出一个尾部元素
5.unshift() //压入到头部
shift() //弹出头部的一个元素
6.sort() //排序方法
7.reverse() //元素反转
8.concat() //连接函数,并没有改变原来数组,而是重新生成一个数组
9.join() //连接符
10.多维数组
2.3对象
若干键值对,注意:最后一个属性值不用写逗号
var 对象名={
属性名:属性值,
属性名:属性值,
属性名:属性值
}
JS中对象,{.....}表示一个对象,键值对描述的是属性,多个属性之间使用逗号隔开
1.对象赋值
对象名.属性值="值"
2.使用一个不存在对象属性,不会报错!
对象名.不存在的属性名 提示ubdefind
3.动态的删减属性,通过delete删除对象的属性:delete 对象名.属性名;
4.动态的添加属性,直接给新的属性添加值即可:对象名.添加的属性名=“值”
5.判断对象中是否存在在这个对象中!xxx(属性名) in xxx(对象名)
6.判断一个属性是否是这个对象自身所拥有的,hasownperpety()
用方法:对象名.hasownperpety('属性名')
2.4流程控制(与java中的流程基本相同)
1.if-else:if(判断条件){ 条件为真时执行的语句 }else{ 条件为假的时候执行的语句 }
2.循环:要避免程序死循环
(1)while( 循环判断条件 ){ }
(2)do{ }where(循环判断条件)
(3) for( 循环变量) { }
3.数组循环:
(1)forearch循环
数组名.forearch( function(value) {
console.log(value);
})
(2)for(var num(注该变量是索引) in 数组 ){
}
3.5map和set
(1)Map:var map =new Map( [ [‘tom’,100],['jk',200],['lh',600] ] );
var name=map.get('tom'); //通过key获得值
添加操作:map.set(键,值);
(2)Set:var set =new set( [ 3,1,1,1,] ); //会将重复的自动去除
set.add(2); //添加操作,若set集合中该元素并不存在,则将添加成功
set.delete(1); //从集合中删除指定元素
set.has(3); //判断集合中是否包含该元素
3.6使用iterator进行遍历
for(var x of 数组(包括map和set)){ } //x代表的是元素,及是元素遍历
4.函数
绝对值函数 function abs( 可传入参数) { }
匿名函数 var abs=function(可以传入参数){ }
5.面向对象编程
js中,拥有类似于java中的对象的概念,不过在js中操作的是每个节点;
5.1操作BOM对象(浏览器)
5.2操作DOM对象(核心)
浏览器网页就是一个Dom树型结果
操作有:
1.更新:更新Dom对象 2.遍历:得到DOM节点 3.删除DOM对象 4.添加:添加一个新的节点
要操作就要先获取dom节点
获取操作:
document.getelementsBytagname("标签名"); //获得该类标签对象组
document.getelementByid("id名"); //通过id名来获得具体的节点
document.getelementByclassName("名字");