第一节
变量:
var str = ‘huahua’;
var age =18;
数组
概念
数组就是一系列有序数据的集合
1、数组中每个值，称之为一个“数组元素”;
2、数组元素可以是任意类型的数据
创建数组(重点)
1、使用new关键字和Array()来创建一个数组(了解)
构造函数方式
var arr = new Array(元素1,元素2,元素3,.....,元素N);
例:创建一个包含五个元素的数组
// 创建方式1
// new Array(元素1,元素2,元素3.....)
// 数组元素时字符串就 ''
// 数字则不用
var arr1 = new Array('huahua',18,'boy','china','latiao');
console.log(arr1);
2、使用中括号[]来创建数组（推荐）
字面量方式
var arr = [元素1,元素2,元素3,...,元素N];`
例:创建数组有五个元素
//元素的个数不限
// 元素之间使用','隔开
var arr2 = ['weilong',2.5,'luohe','latiao','面筋'];
console.log(arr2);
脚下留心
1、new 和 Array关键字，Array 首字母大写
2、数组元素可以写多个，多个之间用逗号隔开“,”
3、var arr = new Array[]; 错误的写法
数组索引(掌握)
1、数组每个元素都对应一个“编码”，通过这个“编号”可以获取指定元素的值.
2、数组元素对应的“编号”，通常称之为“数组下标”或“数组索引”.
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-jJ4mXLuH-1662125201542)(/1560425577003.png)]
脚下留心：
1 数组元素下标从0开始.
2 最大的下标是数组长度-1
// arr[元素1,元素2,元素3.....]
var arr2 = ['weilong',2.5,'luohe','latiao','面筋'];
// 根据下标获取指定元素
console.log(arr2[2]);
例1 :创建一个数组,存入[1,4,5,6,7],并且取出下标为2的,新增下标为8的数据,修改下标为3的数据
<script>
// 创建一个arr数组
var arr = [1,4,5,6,7];
console.log(arr);
// 获取下标为2的元素
console.log(arr[2]); // 5
// 给数组arr添加下标为8的元素
arr[8] = '新增的元素';
console.log(arr);
// 修改数组arr下标为3的元素
arr[3] = '修改下标为3的元素';
console.log(arr);
</script>
总结
1 可以手动为数组指定不存在的下标的值.
2 如果索引对应的值,已存在,再次给其赋值,就是覆盖前面的;
遍历数组,使用for()[重点]
使用length获取数组的长度
var arr = [1,2,3,4,5,6,7,8,9,10];
// 获取数组的长度length
console.log(arr.length); // 10
例1:var arr = [1,2,3,4,5,6,7,8,9,10]; 求出这个数组的和
// 声明变量存储和
var sum =0;
for(var i=0;i<arr.length;i++){
// 循环输出所有的元素
// console.log(arr[i]);
//让数组的每一个元素想加
sum+=arr[i];
}
console.log(sum);
数组的赋值方式
1.静态赋值：直接使用指定的值给指定位置的数组
arr[0] = 1
arr[1] = "hello"
2.动态赋值：在程序运行过程中，创建具体的值给元素赋值
var name='zs';
var age =13;
arr[0] = name;
arr[1] =age;
数组对象的属性和方法[掌握]
数组属性
| 属性名 | 描述 |
|---|---|
| length | 获取数组元素长度，如：arr.length 注：最大下标值，数组长度-1 |
数组的方法
| 方法名 | 描述 |
|---|---|
| arr.sort(); | 给数组排序，先数字后英文再中文,排序规则,按照对应的编码 |
| arr.reverse(); | 反转数组元素 |
| arr.join(str); | 将数组划分为字符串，数组元素以str分隔（默认是逗号） |
| arr.concat(arr1,arr2,…,arr3); | 合并数组，可以是多个，多个之间用逗号隔开“,” |
| arr.pop(); | 弹出arr数组最后一个元素，返回弹出的元素值 |
| arr.push(data); | 给arr数组最后添加一个data元素，返回新数组的长度 |
| arr.shift() | 弹出arr数组第一个元素，并反弹出的元素值 |
| arr.unshift(data); | 给arr数组最前面添加一个data元素，返回新数组的长度 |
| arr.slice(start,end) | 分割数组,返回arr中start到end之间的元素,不包含end |
| splice(start,长度) 用于元素的删除 | 数组中替换或者插入元素,长度为要删除的元素个数 |
例1:数组的各种操作
<script>
var arr = ['feifei',32,'上围36','腰围35','身高169'];
var arr1 = [7,4,5,9,3,2,8];
var arr2 = ['饺子','大盘鸡','拉面'];
// 给数组排序
// 任务:sort的扩展
// console.log(arr1.sort())
// 数组的反转
// console.log(arr1.reverse());
// 将数组分割为字符串,默认逗号分隔
// console.log(arr.join())
// 合并多个数组
//console.log(arr.concat(arr1,arr2))
// 弹出数组最后一个元素
//console.log(arr2.pop());
// 向数组最后,添加元素,返回新数组的长度
// var len = arr2.push('大腰子');
// console.log(arr2,len)
// 弹出数组的第一个元素
// console.log(arr2.shift())
// 数组最前面返回一个元素,返回新数组长度
// var len = arr2.unshift('KFC');
// console.log(arr2)
// console.log(len);
// 数组的分割,slice(start,end),不包括end
console.log(arr.slice(0,3));
// var arr1=arr.slice();//复制数组arr
var arr1=arr.slice(0); //复制数组
var arr1=arr.slice(3);//从第三位截取到尾部复制
var arr1=arr.slice(-2);//从倒数第二位开始截取到尾部
var arr1=arr.slice(-3,-1);//从倒数第三位到倒数第一位
</script>
各种类型数组
整数数组
数组中的元素都是整数
arr = [1,2,3,4,5,6,7]
字符串数组
数组的元素为字符串
arr = ["h","e","l","l","o”]
对象数组
数组的元素为对象
arr = [{name:"Lisa"},{name:"Jack"},{name:"Loss"}];
如何获取对象数组内的元素：arr[1].name; //Jack
例: 创建一个对象数组用于保存商品的信息
var goods =[{'name':'越南新娘','price':100000,'imgs':'xx/cc.jpg','desc':'挣钱'}];
console.log(goods);
二维数组
数组元素可以是任意类型，如果其中一个元素依旧是数组，我们称之为多维数组
语法
var arr = [
元素1,
[元素1,元素2,元素3],
元素3,
元素4
]
使用
var arr = [
1,2,3,[ // 第二维数组
4,5,6
]
];
// console.log(arr);
// 取出第二维中的4
// arr[一维数组的索引][二维数组的索引]
console.log(arr[3][0])
脚下留心
1、元素和元素之间用逗号隔开（,）最后一个元素不用加“，”
2、多维数据理论上可以有N层，在实际工作中一般三层，称之为：三维数组
操作多维数组
获取元素：数组名[一维数组下标][二维数组下标]，如：arr[1][1];
增加元素：数组名[一维数组下标][新增的二维数组下标]，如：arr[1][8]
修改元素：数组名[一维数组下标][已存在的二维数组下标]，如：arr[1][4]
例:创建一个二维数组,通过下标修改值
<script>
// 创建一个二维数组
var arr = [
1,
[8,2,3,4,5],
[8,2,3,4,5],
4,
5
];
// 如何操作二维数组
// 将下标为4的元素值改为：8
console.log(arr[4]);
arr[4] = 8;
console.log(arr);
// 修改arr下标为1的元素
console.log(arr[1]); // [8, 2, 3, 4, 5]
var arr2 = arr[1];
// 获取arr2下标为1的元素值
console.log(arr2[1]);
总结:
综合应用
1.定义一个30项的数组，数组的每一项要求是1－10的随机数.
var arr = [];
for(var i=0;i<30;i++){
// console.log(i);
// 随机数的生成.乘以10得到个位数,再向上取整
// 0.01--0.99 * 10 ====0.1----9.9向上取整====1-10
var num = Math.ceil(Math.random()*10);
// console.log(num);
// 此时拿i当数组的索引,每次循环数组的元素都变化
// 给循环到每个数组下标,动态赋值
//arr[0] = 1;
// arr[1] = 4;
//arr[2] = 5
//....
//arr[28] = 9;
// arr[29] = 8;
arr[i] = num;
}
console.log(arr);
第三节
for-in循环
问题:
在使用for遍历数组的过程中，需要至少确定数组的长度，以判断遍历的次数
但如果遇到数组的元素个数不确定的情况，就不适合使用for循环遍历了
解决办法:
新的遍历方式：for-in循环
例1: 使用for-in循环数组
// n表示是数组的索引
var arr = [1,1,2,3,5,8,13,21,34];
for(var n in arr){
console.log(arr[n]);
}
注意：for-in循环一般用来遍历非数组对象
例2:使用for-in循环对象(了解)
for-in循环中的代码每执行一次，就会对数组的元素或者对象的属性进行一次操作。我们也称这种循环为“枚举”。
var obj = {
name:"lz",
age:36
}
for(var i in obj){
console.log(obj[i]);
}
冒泡排序
概念
依次对数组中相邻数字进行比较(两两比较)，大的放后面
学前准备
思考1 : i=0; i < arr.length 是遍历几次,正常次数
i=0; i < arr.length-1 是遍历几次,比上面少一次
思考2 : 交换两个变量,使用第三个变量 var a=10; var b=20;
思考3 : 数组中的最大值放到最后 var arr = [5, 4, 3, 2, 1];
冒泡排序算法[理解]
比较相邻的元素。如果第一个比第二个大，就交换他们两个。
对每一对相邻元素作同样的工作，从开始第一对到结尾的最后一对。在这一点，最后的元素应该会是最大的数。
针对所有的元素重复以上的步骤，除了最后一个。
持续每次对越来越少的元素重复上面的步骤，直到没有任何一对数字需要比较。 [1]
代码实现
<script>
var arr = [5, 4, 3, 2, 1];
for (var j = 0; j < arr.length-1; j++) {
for (var i = 0; i < arr.length-1-j; i++) {
if (arr[i] > arr[i + 1]) {
var temp = arr[i];
arr[i] = arr[i + 1];
arr[i + 1] = temp;
}
}
}
console.log(arr);
</script>
选择排序
算法原理[理解]
将第一位依次与后面的元素相比较，得到最小值，与第一位交换。
再用第二位依次与后面元素相比较，得到最小值，与第二位交换。
从原始数据中找到最小元素，并放在数组的最前面。然后再从下面的元素中找到最小元素，放在之前最小元素的后面，直到排序完成
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-vRu3LDXE-1662125201543)(/1629623524500.png)]
// 两个值互相比较,小的值放在前面
// 将第一位依次与后面的元素相比较，得到最小值，与第一位交换。
// 再用第二位依次与后面元素相比较，得到最小值，与第二位交换。
var arr = [5,4,3,2,1];
for(var i=0;i<arr.length-1;i++ ){ // 确定比较的遍数
// 假设一个最小值,和索引
var min = arr[i];
var minIndex = i;
for(var j=i+1;j<arr.length;j++){ // 让数组中的每一个元素进行比较
// 用假设的最小值,和当前循环的元素进行比较
if(min>arr[j]){
// 替换最小值,继续进行比较
min = arr[j];
minIndex = j;
}
}
// 将真正的最小值,放到对应的位置
arr[minIndex] = arr[i];
arr[i] = min;
}
console.log(arr);
栈和堆
每个内存单元中分为两个部分，栈(stack)和堆(heap)
栈内存主要用于存储各种基本类型的**变量，包括Boolean、Number、String、Undefined、Null，**以及对象变量的指针，这时候栈内存给人的感觉就像一个线性排列的空间，每个小单元大小基本相等。
优点：存取速度比堆快，仅次于直接位于CPU中的寄存器，数据可以共享；
缺点：存在栈中的数据大小与生存期必须是确定的，缺乏灵活性
堆内存: 动态分配的内存，大小不定也不会自动释放，存放引用类型，指那些可能由多个值构成的对象，保存在堆内存中，包含引用类型的变量，实际上保存的不是变量本身，而是指向该对象的指针。
var str = ‘123’;
var obj = {};
引用类型**：Function，Array，Object
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6kbHEJAq-1662125201544)(/1560433566182.png)]
栈内存中,存放的有堆内存中保存的对象对应的指针.每一次调用Object,都是通过栈中指针找到堆中Object的实际位置.
例1:声明两个变量,赋值
var a =10;
var b =a;
b =20;
例2:声明对象进行比较
var obj1 = {
name:'zs',
age:18
}
var obj2= obj1;
// 观察obj1的值,是否变化
obj2.age =28;
对象的本质和意义[理解]
对象意义
现实生活中 : 万物皆对象, 对象是一个具体的事物 , 一个具体的事物就会有 特征 和 行为 ;
JavaScript中: js 中的对象就是生活中对象的一个抽象, 没有特征和行为,取而代之的是有对应的属性和方法 ;
对象创建
字面量对象
1. 学生对象:
// 特征 : 名字,性别,身高,体重
// 行为 : 吃饭、睡觉、敲代码
2. js的对象 属性+方法
3. 对象初体验
var stu = {
// 键 值 对
// 属性名 : 属性值
// 属性名 : 变量 => 不是字符型
// 属性值 : 任意类型
name : 'zs',
gender: '男'
height:170;
weight:170;
eat:function(){
console.log('吃饭');
}
}
通过Object构造函数创建
var p = new Object(); // 创建一个空的对象
var p = new Object({name :'xx'});
对象属性调用
. 语法
调用属性: 对象名.属性名
// 获取对象属性的语法：
// 对象.属性：对象的属性
// 1. 如果有这个属性，直接返回属性值
// 2. 如果没有这个属性，返回undefined
// 设置对象的属性的语法
// 对象.属性 = 值
// 1. 如果对象有这个属性，修改这个属性
// 2. 如果对象没有这个属性，添加这个属性
var obj = {
name : 'zs'
}
console.log ( obj.name ) //ok
console.log ( obj.'name' ) // X
obj.name = '峰哥'; //ok
var key = 'name';
console.log ( obj.key ) // X
[ ]语法
当属性是变量的时候,就要用[]才能解析
对象名 [ 变量 ] (字符串)
var key = 'name';
console.log ( obj['name'] ) // x
console.log ( obj[name] ) // ok
console.log ( obj[key] ) //ok
二者的区别：当属性名是一个字符串存储在变量中的时候，只能使用关联数组的方式。
各种对象
数组(Array)，对象(Object)都是对象
Array()类
var arr = new Array();
var arr2 = new Array();
var arr=[];
属性
对象.length 获取数组的长度
方法
对象.pop() 弹出数组的最后一个元素，并返回弹出的值
对象.push(n); 给数组添加一个元素，并返回新数组的长度
上面的常规对象其实等价于：
var obj = new Object();
obj.name = "lz";
obj.age = 36
obj.skill = function(){
console.log(1);
}
外面的变量对应对象身上的属性
外面的函数对应对象身上的方法
通过"."(点),当这个属性名是具体的值的时候
对象就是其中包含了很多的属性和方法,可以通过对象的名字进行调用.对象相当于手机,里面有很多功能,想要使用功能必须有手机.
JSON表示对象的方法[了解]
什么是json
JSON是独立的语言
JSON 是用于存储和传输数据的格式,通常用于服务端向网页传递数据
JSON 语法规则
-
数据为 键/值 对。
-
数据由逗号分隔。
-
大括号保存对象
-
方括号保存数组
-
json中键也要用引号引起来
例1:使用json对象保存一个人的信息,包括name,sex,age
var json_str = {"name":"张三", "sex":"男","age":16};例2:通过json表示多个人的信息
var json_arr = [ {"name":"张三", "sex":"男","age":16} {"name":"李四", "sex": "公", "age": 18}, {"name":"战三", "sex": "公", "age": 18} ]; 在以上实例中，"json_arr" 是一个数组，包含了三个对象。解释:
中国通用语言：普通话 计算机语言中的通用数据：JSON，是计算机各种语言之间数据沟通的桥梁例3: json对象成员的使用，添加方法
var demo = { "name":'zs', "age":18, "eat":function(){ alert(1234); } } console.log(demo.name); console.log(demo.eat()); 可以像对象那样调用属性和方法
第四节: 练习与应用
1.编写函数map(arr) 把数组中的每一位数字都增加30%
2.编写函数has(arr , 60) 判断数组中是否存在60这个元素，返回布尔类型
function has(arr1, num) {
var exists = false;
for (var i = 0; i < arr1.length; i++) {
// console.log(arr1[i]);
if (arr1[i] == num) {
exists = true;
}
}
return exists
}
var res = has(arr, 60);
console.log(res);
// 接受返回值
var bo = has(num,60);
// 判断返回值并输出,有还是没有
if(bo){
console.log('包含60这个数字');
}else{
console.log('不包含60这个数字');
}
作业
1.编写函数norepeat(arr) 将数组的重复元素去掉，并返回新的数组(看情况写)
var myarr = ["a","b","c","c","b","a","d","f","f","a","b","c"];
console.log(myarr)
function norepeat(arr){
var obj = {}
for(var i=0;i<arr.length;i++){
var attr = arr[i];
if(!obj[attr]){
obj[attr] = 1
}else{
obj[attr]++
}
}
console.log(obj)
var sArr = []
for(var i in obj){
sArr.push(i)
}
console.log(sArr)
return sArr;
}
console.log(norepeat(myarr))
2.使用JSON形式创建一个对象，该对象存储一个学生的信息，该对象包含学号、身份证、年龄、性别、所学专业等属性信息，同时该对象包含一个自我介绍的方法，用来输出该对象的所有信息
var arr = [{
"name":"admin",
"age":18,
"sex":1,
show:function(){
console.log("我叫："+arr[0].name+"，我今年："+arr[0].age+"岁,")
}
},{
"name":"root",
"age":16,
"sex":0,
"show":function(){
console.log("我叫："+arr[1].name+"，我今年："+arr[1].age+"岁,")
}
}]
arr[0].show()
arr[1].show()
f",“f”,“a”,“b”,“c”];
console.log(myarr)
function norepeat(arr){
var obj = {}
for(var i=0;i<arr.length;i++){
var attr = arr[i];
if(!obj[attr]){
obj[attr] = 1
}else{
obj[attr]++
}
}
console.log(obj)
var sArr = []
for(var i in obj){
sArr.push(i)
}
console.log(sArr)
return sArr;
}
console.log(norepeat(myarr))
2.使用JSON形式创建一个对象，该对象存储一个学生的信息，该对象包含学号、身份证、年龄、性别、所学专业等属性信息，同时该对象包含一个自我介绍的方法，用来输出该对象的所有信息
var arr = [{
"name":"admin",
"age":18,
"sex":1,
show:function(){
console.log("我叫："+arr[0].name+"，我今年："+arr[0].age+"岁,")
}
},{
"name":"root",
"age":16,
"sex":0,
"show":function(){
console.log("我叫："+arr[1].name+"，我今年："+arr[1].age+"岁,")
}
}]
arr[0].show()
arr[1].show()
434
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
