js的标准ECMAScript(ES),现在使用的版本为ES6
js编写的位置
1.写在HTML中的scrip标签
<script>javascript">
//内嵌式
console.log("hello world")
</script>
<!--引入外部的js文件,script不能使用单标签-->
2.引用中使用
<script src="../js/01_index.js">javascript">
/*内嵌和已引入的不能写在一起,否则不起作用*/
console.log("xxxxx")
</script>
3.在标签里面书写
代码不容易维护
<a href="javascript:console.log('aaaa')">点击</a>
js的变量
作用:多次使用变量的值,达到多次使用的目的
1.js是弱类型的语言,没严格区分数据类型,
使用的关键字是var,默认的变量值是undefined
变量没有定义之前不能直接使用,报错not defined
log是浏览器的控制台打印
<script>javascript">
//变量的定义
//var 变量名=张三
var name="张三";
console.log(name)
var age;//默认为undefined
//变量没有定义之前不能直接使用,报错not defined
console.log(age)
console.log(window)//打印所有信息
console.error("这是一个错误信息")
</script>
js的数据类型(重要)
数据类型由赋的值来决定的
简单类型:String,Number,Boolean,Null,undefined,
对象类型:Objiect,Array,Function
js的运算符
1.等号
= 将常量/变量的值赋值给另一个变量
== 比较值,不管类型
=== 类型和值都进行比较,先类型比较再值的比较
<script>javascript">
var a='1';
var b=2;
// == 比较值,不管类型
console.log(a == b)
// === 类型和值都进行比较,先类型再值
console.log(a === b)
</script>
2.逻辑运算符
0, null, NaN, " ", false, undefined表示为false
其他的数据类型表示的为true
3.&&和||运算符的区别
&&值判断 :当全部为true的时候结果才为true(返回最后一个为true的值),当有一个false的时候结果false(返回第一个为false的值)
console.log(true && true);//true
console.log(1 && true);//true
console.log(1 && 2);//2
console.log("A" && 2);//2
console.log("" && 2);//""
console.log(null && "B");//null
console.log("A" && "B");//"B
console.log(1 && 2 && 3);//3
console.log(1 && null && 3);//null
console.log("" && null && 0);//""
||值判断 :当全部为false的时候结果为false(返回最后一个false的值),当有一个true的时候结果为true(返回第一个为true的值)
console.log(true || true);//true
console.log(1 || true);//1
console.log(1 || 2);//1
console.log("A" || 2);//"A"
console.log("" || 2);//2
console.log(null || "B");//"B"
console.log("A" || "B");//"A"
console.log(1 || 2 || 3);//"1"
console.log(1 || null || 3);//"1"
console.log("" || null || 0);//0
逻辑运算符的应用场景
给形参设置默认值的时候进行使用
若没有给形参传入值的话返回的结果就是undefined
<script>javascript">
function add(a,b){
//给形参设置默认值
a=a||1;//a为undefined就返回1
b=b||1;
console.log(a+b)
}
add(1,2)
</script>
js的函数
函数和java中的方法作用一样,一次编写,实现代码复用
函数的定义:
function 函数名(形参名1,形参名2,...){
//函数体
[return 返回值]
}
函数的调用
对象名.方法名(参数名)
<script>javascript">
function add(num1,num2){
var sum=num2+num1;
console.log(sum);
//return sum;
}
add(1,2);
</script>
注意:
1.调用函数时可以不和形参匹配(数量)
2.函数如果没有返回值,默认的返回值为undefined
3.如果有返回值,则返回真实值
匿名函数(重要)
可以将匿名函数看成普通的值进行理解
1.匿名函数的定义):
function fun(){}
2.将函数赋值给变量(常用的)
var fun2=function(){
console.log("匿名函数1");
}
3.**console.log(fun2);**打印整个函数的格式
ƒ (){
console.log("匿名函数2")
}
4.**console.log(fun2());**打印两个结果
//里面的fun2添加了()会执行里面的方法并进行打印
//但是这个函数没有返回值,后台打印的值还包括undefined
匿名函数2
undefined
5.将函数作为值进行传递,将函数赋值给变量
var fun3=fun2;
//fun2加了括号就就将fun2的执行结果进行打印
var fun3=fun2();//结果为:匿名函数2
6.将函数作为形参进行传递,
//将函数作为参数进行传递
var fun4=function (f){
console.log(f);
f();
}
fun4(fun2)
/*
*结果为:
*ƒ (){
* console.log("匿名函数2")
* }
*匿名函数2
*
*/
内置函数arguments
arguments:每个函数都有内置的变量,存储了函数所有的实参
使用该函数查看调用时传进来了哪些值
<script>javascript">
//求n个数的和
var add= function (){
//console.log(arguments[0]);
var sum=0;
for (var i = 0; i < arguments.length; i++) {
sum+=arguments[i];
}
console.log(sum);
}
add(1);
add(1,2);
add(1,2,3);
</script>
注意事项:
调用函数的时候,传入实参个数可以和定义函数的形参个数不一致
面向对象
类依据对多个对象抽象而来,对象是由类实例化而来
1.类的定义,首字母大写
function person(name,age){
//属性
this.name=name;
this.age=age;
//方法
this.eat=function (){
console.log(this.name+"想吃饭");
}
}
2.创建对象
//对象的创建;
var p=new person("张三",21)
console.log(p);
//调用对象里面的方法
p.eat();
//访问对象的属性
console.log(p.name);
console.log(p.age);
//修改对象中属性的值
p.name="李四";
3.给对象添加或者删除属性或者方法
p.xxx="11111";
delete p.xxx;
4.创建对象的快捷方式,使用键值对的形式
var obj={
name:"张三";
age:23;
sleep:function(){
console.log()"睡觉");
}
}
内置对象
查看这个对象中是否存在这个属性,返回的值时true/false
obj.hasOwnProperty("name");
获取时间的毫秒值,用于获取随机数的时候进行使用
var d=new Date();
//获取毫秒值
console.log(d.getTime());
对字符串的操作
var str="asdfhjkl"
//获取长度
console.log(str.length);
//根据索引取字符
console.log(str.charArt(2));
//去字符中执行区间的字符串,左闭右开的形式
console.log(str.subString(0,3));
js数组
注意:
1.js中的数组不会出现索引越界的问题,长度是不固定的
2.当访问不存在的属性的时候,js引擎会返回undefined
数组的定义方式
方式一:静态初始化
var arr=new Arry(1,2,3,4,5)
**方式二:**动态初始化,定义数组的长度
var arr=new Arry(4);
数组简写
var num=[1,2,3,4,5,6]
数组常用的属性和方法
操作数组
//获取数组的长度
num.length;
//获取数组中指定索引的值
num[2];
//修改指定索引的值
num[3]=8;
//多个数组的拼接,返回的是一个新的数组
var num2=[5,8,9,7]
num.concat(num2);
//给数组中的值添加分割符
num2.join("|");
//截取
num2.slice(0,2);
//删除最后一个元素
num2.pop();
使用splice对数组进行增删改
//使用splice关键字
//添加,索引为1插元素
arr.splice(1,0,20);
console.log(arr);
//替换
arr.splice(1,1,30)
console.log(arr);
//删除
arr.splice(2,1)
console.log(arr);
