首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >(JavaScript)前端小白还没学JS吗?跟着本文开启JS的旅程吧!(七):JS的垃圾回收机制、深度刨析JS中的数组用法;map、forEach、for三种循环示例;join、push等方法示例

(JavaScript)前端小白还没学JS吗?跟着本文开启JS的旅程吧!(七):JS的垃圾回收机制、深度刨析JS中的数组用法;map、forEach、for三种循环示例;join、push等方法示例

作者头像
用户11865655
发布2025-10-13 17:36:11
发布2025-10-13 17:36:11
15200
代码可运行
举报
文章被收录于专栏:CSDN专栏CSDN专栏
运行总次数:0
代码可运行

JavaScript 垃圾回收(GC)

垃圾回收(GC),就像人生活的时间长了会产生垃圾一样,程序运行过程中也会产生垃圾。 这些垃圾积攒过多以后,就会导致程序运行的速度过慢,所以我们需要一个垃圾回收机制,来处理程序运行过程过产生垃圾

  • 当一个对象没有任何的变量或则属性对他进行引用,此时我们将永远无法操作该对象,此时这种对象就是一个垃圾,这种对象过多会占用大量的内存空间,导致程序运行变慢,所以这种垃圾必须清理。
  • 在JS中拥有自动的垃圾回收机制,会自动将这些垃圾对象在内存中销毁,我们不需要也不能进行垃圾回收的操作。
  • 我们需要做的知识将不再使用的对象设置为null即可
代码语言:javascript
代码运行次数:0
运行
复制
var obj=new Object();
obj.name="zhangsan";
//....操作完以后

obj=null;

数组对象 - 数组(Array)

  • 数组也是对象(内建对象)
  • 它和我们普通对象功能类似,也是用来存储一些值的
  • 不同的是普通对象使用字符串作为属性名 而数组是使用数字来作为索引操作元素

索引:从0开始的整数就是索引

  • 数组的存储性能比普通对象要好,在开发中我们经常使用数组来存储一些数据
代码语言:javascript
代码运行次数:0
运行
复制
//创建数组对象
var arr=new Array();
console.log(typeof arr);
/*
	向数组中添加元素
	语法:数组[索引] = 值
*/
arr[0]=12;
arr[1]=34;
arr[2]=56;
arr[4]=67;
console.log(arr);

读取数组中的元素 语法:数组[索引] 如果读取不存在的索引,不会报错而是返回undefined

代码语言:javascript
代码运行次数:0
运行
复制
console.log(arr[1]);//12
console.log(arr[3]);//undefined

获取数组的长度,可以使用length这个属性获取 语法:数组.length

  • 对于连续的数组,使用length可以获取到数组的长度(元素的个数)
  • 对于非连续的数组,使用length汇获取到数组的最大的(索引+1)

尽量不要创建非连续数组

代码语言:javascript
代码运行次数:0
运行
复制
console.log(arr.length);

修改length

  • 如果修改的length大于原长度,则多出部分会空出来
  • 如果修改的length小于原长度,则多出的部分会被删除
代码语言:javascript
代码运行次数:0
运行
复制
arr.length=10;
//	console.log(arr);
arr.length=2;
console.log(arr);

JavaScript数组字面量

代码语言:javascript
代码运行次数:0
运行
复制
//创建一个数组
var arr=new Array();

//使用字面量来创建数组
var arr1=[];
//语法:[]
console.log(arr1);
//使用字面量创建数组时,可以在创建时就指定数组中的元素
var arr2=[12,34,56,7,8,9,0,3,5];
//console.log(arr2[2]);//56
console.log(arr2);
//使用构造函数创建数组时,也可以同时添加元素,将要添加的元素作为构造函数的参数传递,元素之间使用,隔开
var arr3=new Array(12,34,56,7,8,9,0,3,5);
console.log(arr3);
//创建数组arr4,这个数组中只有一个元素10
var arr4=[10];
console.log(arr4);
//创建一个长度为10的数组
var arr5=new Array(10);
console.log(arr5);
//数组的值可以是任意的数据类型,包含对象的
var arr6=["hello",123,false,undefined,null];
console.log(arr6);
//数组中可以存放函数
var arr7=[function(){alert(123);},function(){alert("helloworld");}];
console.log(arr7[0]);
//	arr7[0]();
//二维数组
var arr8=[
	[1,3,4,5],
	[1,4,6,7]
];
console.log(arr8[1][2]);

JavaScript数组的方法

.concat()

  • 连接两个或更多的数组,并返回结果。
代码语言:javascript
代码运行次数:0
运行
复制
var arr=["小明","小红","小橙"];	
var arr1=["小黑","小绿","小蓝"];	
var arr2=arr.concat(arr1);

.join()

  • 把数组的所有元素串联成一个字符串。元素通过指定的分隔符进行分隔
代码语言:javascript
代码运行次数:0
运行
复制
var arr=["小明","小红","小橙"];	
var arr1=["小黑","小绿","小蓝"];

var str=arr.join("~~");
console.log(arr);
console.log(str);

.push()

  • 该方法可以向数组的末尾添加一个或多个元素,并返回数组的新的长度
  • 可以将要添加的元素作为方法的参数传递,这样这些元素将会自动添加到数组的末尾
  • 该方法会将数组新的长度作为返回值返回
代码语言:javascript
代码运行次数:0
运行
复制
var arr=["小明","小红","小橙"];	
var arr1=["小黑","小绿","小蓝"];

var num=arr.push("小白","小黑");
console.log(num);
console.log(arr);

.pop()

  • 该方法可以删除数组的最后一个元素,并将被删除的元素作为返回值返回
代码语言:javascript
代码运行次数:0
运行
复制
var arr=["小明","小红","小橙"];	
var arr1=["小黑","小绿","小蓝"];

var result=arr.pop();
//	arr.pop();
console.log("result="+result);
console.log(arr);

.unshift()

  • 向数组开头添加一个或多个元素,并返回新的数组长度
  • 向前边插入元素以后,其他元素的索引会依次调整
代码语言:javascript
代码运行次数:0
运行
复制
var arr=["小明","小红","小橙"];	
var arr1=["小黑","小绿","小蓝"];

var num=arr.unshift("小白","小黑");
console.log("num="+num);
console.log(arr);

.shift()

  • 可以删除数组的第一个元素,并将被删除的元素作为返回值返回
代码语言:javascript
代码运行次数:0
运行
复制
var arr=["小明","小红","小橙"];	
var arr1=["小黑","小绿","小蓝"];

arr.shift();
console.log(arr);

数组的遍历

for

  • 数组的遍历就是将数组中的每一个元素都取出来
  • 数组的遍历需要一个循环语句
  • 遍历数组的标准格式
代码语言:javascript
代码运行次数:0
运行
复制
for(var i=0;i<arr.length;i++){
	//每一次循环,就会遍历到数组中的一个元素
	//将当前遍历到的数组元素,保存到一个变量中
}
代码语言:javascript
代码运行次数:0
运行
复制
//创建一个数组
var arr=["小明","小红","小橙","小蓝","小绿"];
//所谓的遍历数组,就是将数组中所有的元素都取出来
//	for(var i=0;i<arr.length;i++){
//		console.log(arr[i]);
//	}
for(var o in arr){
//		console.log(o);
//		console.log(arr[o]);
}
//创建一个函数,可以将arrPerson中年满18岁的Person提取出来,然后封装到到一个新的数组并返回
function Person(name,age){
	this.name=name;
	this.age=age;
}
var p1=new Person("小红",12);
var p2=new Person("小橙",17);
var p3=new Person("小黄",19);
var p4=new Person("小绿",32);
var p5=new Person("小青",22);
var p6=new Person("小蓝",24);
var p7=new Person("小紫",42);
var arrPerson=[p1,p2,p3,p4,p5,p6,p7];

function getAdult(arr){
	var arrAdult=[];
	///写你自己赛选功能的代码
	for(var i=0;i<arr.length;i++){
//			console.log(arr[i]);
		//如果年满18,就把该对象添加到arrAdult数组中
		if(arr[i].age>=18){
			arrAdult.push(arr[i]);
		}
	}
	return arrAdult;
}

//	var adult=getAdult(arrPerson);
var adult=getAdult(arrPerson);
console.log(adult);

forEach

数组中有一个方法可以遍历数组,这个方法就是forEach()

  • 这个方法需要一个函数作为参数
  • 我们将函数作为参数传递给forEach()方法时,不需要调用,只需要将函数定义传递进去
  • 那么我们的函数就会自动遍历数组中的每一个元素
  • 遍历的每一个元素,都会自动的调用我们传递的函数
  • forEach()方法中传递的函数,需要我们自己来定义
    • 我们自己定义的函数,要求有参数,参数的名字可以自己起,但是参数的个数是固定的
    • 第一个参数,就是当前正在遍历的元素
    • 第二个参数,就是当前正在遍历的元素的索引
    • 第三个参数,就是正在遍历的数组
代码语言:javascript
代码运行次数:0
运行
复制
arr.forEach(function(value,index,array){
	console.log(value);
	console.log(index);
	console.log(array);
});

forEach()

  • 这个方法只支持IE8以上的浏览器 IE8及以下的浏览器均不支持该方法,所以如果需要兼容IE8,则不要使用forEach 如果考虑到兼容问题还是使用for循环

map()

map 方法是数组对象的一个内置方法,它会对数组中的每个元素执行指定的回调函数,并返回一个新的数组。

  • value(必需):当前正在处理的数组元素的值
  • index(可选):当前元素的索引
  • array(可选):调用 map 方法的数组本身
代码语言:javascript
代码运行次数:0
运行
复制
arr.map(function(value,index,array){
	console.log(value);
	console.log(index);
	console.log(array);
});

map 方法不会改变原数组,而是返回一个新数组 回调函数必须包含 return 语句,否则新数组中的元素都会是 undefined

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2025-07-19,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • JavaScript 垃圾回收(GC)
  • 数组对象 - 数组(Array)
  • JavaScript数组字面量
  • JavaScript数组的方法
    • .concat()
    • .join()
    • .push()
    • .pop()
    • .unshift()
    • .shift()
  • 数组的遍历
    • for
    • forEach
    • map()
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档