本节课讲解了JS的基本语法,对象的创建知识
用户创建函数,函数创建对象,对象生成一切:在JS中一切皆对象
js脚本主要有变量和函数二部分组成
变量创建方式:
var:可以重复声明变量值覆盖,同时跨作用域,方法中的变量外部都是可见的
let:只能声明一次,跨作用域不可见(建议使用)
变量类型分为两大类:原始类型,引用类型
原始类型:string,number,boolean,undefined,null
引用类型:object,array,function,date,regexp,包装对象
typeof 查看数据类型
Array.isArray([1,2,3]) 判断是否为数组类型
clear() 清空控制台
--------------------------------------------------------------------------
函数分为:普通函数,函数表达式,匿名函数,自执行函数
----普通函数
let ac=10
function ad(){return ac+50;}
ad()//返回结果值60,函数外部声明的变量,在函数内部可以自己使用,但在函数内部声明的变量,在外部不能直接使用
----表达式函数,就是一个值
let ae=function(){return 200;}
ae()//返回结果值200
----匿名函数,主要用途就是传参
使用filter方法,函数item数组元素 index索引 array数组,返回元素大于3的结果返回[4,5]
[1,2,3,4,5].filter(function(item,index,array){return item>3})
----自执行函数,声明完成后自己运行
(function af(a,b){return a+b;})(20,50)
和普通函数相似,下面是进行的拆解
// (
// function af(a,b){return a+b;}
// )
// (20,50)
------------------------------------------------------------
// ----创建数组
//js中数组默认都是索引数组,如果需要使用关联数组需要模拟
//let arr1=[1,2,4] //使用字面量方式创建
//let arr2=new Array();//使用构造函数创建
//let arr3=new Array(3);//使用构造函数创建,有3个元素的素质
//let arr4=new Array(1,2,3,4);
// arr4[3]//获取到的是数组中的值4
//arr4[arr4.length-1] //获取到数组中元素个数,默认是从1开始所以这里返回的是4,使用-1,再返回最后一个元素值
// ---------------------------------------------------------------------
// 使用concat,不直接更新改变原素组的值,并且在数组尾部添加
// let arr=[1,2,3,4,5] //定义数组
// arr.concat(4,5,6,7) //在数组尾部添加元素,输出[1, 2, 3, 4, 5, 6, 7]
// arr.concat([6,7,8]) //在数组的尾部添加元素,输出[1, 2, 3, 6, 7, 8]
//使用 slice(),获取数组的结果,从指定的位置开始获取
// arr.slice(2) //输出结果[3]
//arr.slice(1,3);//从第2个位置取到第4个位置,输出结果不包含第4个位置,最后一个
// ---------------------------------------------------------------------
//arr.splice()增删改查都能实现,直接改变原数组
//删除
// arr5.splice(0,2) //删除数组中的第一个元素到第二个,不包含2最后一个
//添加
// arr5.splice(1,0,88,99) //1是起始位置,插入的数量,插入的值
//替换
//arr5.splice(2,1,55,44) //2是起始位置，1是替换的个数，如果超过自动多插入一个，55 44是要替换和插入的值
// ---------------------------------------------------------------------
//队和栈
let arr=[];
arr.push(10,20)//入队,最后添加
arr.pop()//出栈,最后一个值
arr.unshift(8,67)//入栈,头部添加
arr.shift()//出队,头部第一个值
//尾部添加,头部出
arr.push(3,2,1);
arr.shift();
//头部添加,尾部出
arr.unshift(6,7,8)
arr.shift()
实例使用构造函数创建
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
let obj=new Object();//创建对象
obj.name='熊成浩';//设置属性和值
obj.age=30;
obj.sex='男';
//创建方法getName,
obj.getName=function(){
return this.name;}
//执行方法返回this.name当前对象中的name
obj.getName();
//访问属性值
obj["name"];
obj['name'];
obj.name;
</script>
</head>
<body>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
实例使用字面量创建
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
let obj2={
name:'熊成浩',
age:30,
sex:'男',
getName:function () {return this.name;
}
}
//执行方法
obj2.getName();
//访问属性值
obj2["name"];
obj2['name'];
obj2.name;
</script>
</head>
<body>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
实例使用用户自定义的构造函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script>
function Stu(name,sex,age)
{
this.name=name;
this.sex=sex;
this.age=age;
//方法这样写会出现代的冗余,每次执行实例都需要生成
// this.getInfo=function () {
// return this.name+': '+this.age+': '+this.sex;
//
// }
}
//建议将公共方法写在外部,写到原型上
Stu.prototype.getInfo2=function () {
return this.name+': '+this.age+': '+this.sex;
}
let stu1=new Stu('小强','男',18);
let stu2=new Stu('小张','女',16);
let stu3=new Stu('小黄','男',22);
console.log(stu1);
console.log(stu2);
console.log(stu3);
// console.log(stu1.getInfo());
// console.log(stu2.getInfo());
// console.log(stu3.getInfo());
console.log(stu1.getInfo2());
console.log(stu2.getInfo2());
console.log(stu3.getInfo2());
</script>
</head>
<body>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
总结:用户创建函数,函数创建对象,对象生成一切:在JS中一切皆对象
