当前位置: 首页> 文旅> 旅游 > 【前端】JavaScript入门及实战76-80

【前端】JavaScript入门及实战76-80

时间:2025/9/3 11:44:14来源:https://blog.csdn.net/weixin_45980065/article/details/140605940 浏览次数:0次

文章目录

  • 76 数组的方法
  • 77 数组练习
  • 78 数组的剩余方法
  • 79 数组的方法
  • 80 arguments

76 数组的方法

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">/*slice()可以用来从数组中提取指定元素该方法不会改变元素数组,而是将截取到的元素封装到一个新数组中返回参数:1. 截取开始位置的索引,包含开始索引2. 截取结束位置的索引,不包含结束索引第二个参数可以省略不写,此时截取从开始索引往后的所有元素索引可以传递一个负值,负值从后往前计算-1是倒数第一个*/var arr = ["孙悟空", "猪八戒", "沙和尚", "白龙马", "唐三藏"];var res = arr.slice(0, 2); // "孙悟空", "猪八戒"res = arr.slice(1); // "猪八戒", "沙和尚", "白龙马", "唐三藏"res = arr.slice(1, -2); //  "猪八戒", "沙和尚"/*splice()可以用于删除数组中的指定元素会影响到原数组,会将指定元素从原数组中删除并将被删除的元素作为返回值返回参数:1. 第一个,表示开始位置的索引2. 第二个,表示删除的数量3. 第三个及以后,可以传递一些新的元素,这些元素将会自动插入到开始位置索引前面*/var arr = ["孙悟空", "猪八戒", "沙和尚", "白龙马", "唐三藏"];var res = arr.splice(0, 2); // "孙悟空", "猪八戒"console.log(arr);res = arr.splice(0, 2, "牛魔王", "铁扇公主"); // "牛魔王", "铁扇公主", "沙和尚", "白龙马", "唐三藏"res = arr.splice(0, 0, "牛魔王", "铁扇公主"); // "牛魔王", "铁扇公主", "孙悟空", "猪八戒", "沙和尚", "白龙马", "唐三藏"	
</script>
<style>
</style>
</head>
<body>
</body>
</html>

77 数组练习

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">// 创建一个数组var arr = [1, 2, 3, 2 ,1, 3, 4, 2, 5];// 去除数组中重复的数字for(var i = 0; i < arr.length; i++){for(var j = i + 1; j < arr.length; j++){if(arr[j] == arr[i]){arr.splice(j, 1);j--;}}}document.write(arr);
</script>
<style>
</style>
</head>
<body>
</body>
</html>

78 数组的剩余方法

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">var arr = [1, 2, 3];var arr2 = [4, 5, 6];var arr3 = [7, 8, 9];/*concat()可以连接两个或多个数组,并将新的数组返回该方法不会对原数组产生影响*/var res = arr.concat(arr2); // 1, 2, 3, 4, 5, 6res = arr.concat(arr2, arr3, "牛魔王"); // 都连到一块,拼接成一个数组/*join()该方法可以将数组转换为一个字符串该方法不会对原数组产生影响,而是将转换后的字符串作为结果返回在join()中可以指定一个字符串作为参数,这个字符串将会成为数组中元素的连接符如果不指定连接符,则默认使用“,”作为连接符*/res = arr.join(); // typeof res -> stringres = arr.join("-"); // "1-2-3"res = arr.join(""); // "123"/*reverse()该方法用来反转数组(前边的去后边,后边的去前边)该方法会直接修改原数组*/arr.reverse(); // 321/*sort()可以用来对数组中的元素进行排序也会影响原数组,默认会按照Unicode编码进行排序即使对于纯数字的数组,使用sort()排序时,也会按照Unicode编码来排序所以对数字进行排序时,可能会得到错误的结果我们可以自己来指定排序的规则可以在sort()中添加一个回调函数,来指定排序规则,需要定义两个形参,浏览器将会分别使用数组中的元素作为实参去调用回调函数,使用哪个元素调用不确定,但是肯定的是,数组中a一定在b前面浏览器会根据回调函数的返回值来决定元素的顺序,如果返回一个大于0的值,则元素会交换位置,如果返回一个小于0的值,元素位置不变,如果返回一个0的值,则两个元素相等,也不交换位置*/arr = ["b", "d", "c", "a", "e"];arr.sort(); // abcdearr.reverse(); // edcbaarr = [3, 4, 1, 2, 5];arr.sort(); // 1, 2, 3, 4, 5arr = [3, 4, 11, 2, 5];arr.sort(); // 11, 2, 3, 4, 5arr = [5, 4, 3];arr.sort(function(a, b){// a = 5, b = 4; a = 4, b = 3console.log(a); console.log(b);});// 升序排列arr.sort(function(a, b){// 前边的大if(a > b){return 1;}else if(a < b){return -1;}else{return 0;}// 升序排列return a - b;// 降序排列return b - a;});	
</script>
<style>
</style>
</head>
<body>
</body>
</html>

79 数组的方法

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">/*call()和apply()这两个方法都是函数对象的方法,需要通过函数对象来调用当对函数调用call()和apply()都会调用函数执行在调用call()和apply()可以将一个对象指定为第一个参数,此时这个对象将会成为函数执行时的thiscall()方法可以将实参在对象之后依次传递apply()方法需要将实参封装到一个数组中,统一传递this的情况:1. 以函数形式调用时,this永远都是window2. 以方法的形式调用时,this是调用方法的对象3. 以构造函数的形式调用时,this是新创建的那个对象4. 使用call和apply调用时,this是指定的那个对象		*/function fun(){alert(this);}function fun(a, b){console.log(a);console.log(b);}var obj = {name:"obj",sayName: function(){alert(this.name);}};var obj2 = {name:"obj2"};fun.call();fun.apply();fun.call(obj); // objobj.sayName.apply(obj2); // obj2fun.call(obj, 2, 3); // a = 2, b = 3fun.apply(obj, 2, 3); // 错误fun.apply(obj, [2, 3]); // 正确 a = 2, b = 3
</script>
<style>
</style>
</head>
<body>
</body>
</html>

80 arguments

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset = "utf-8">
<script type="text/javascript">/*在调用函数时,浏览器每次都会传递两个隐含的参数1. 函数的上下文对象this2. 封装实参的对象argumentsarguments是一个类数组对象,它也可以通过索引来操作数据,也可以获取长度在调用函数时,我们所传递的实参都会在arguments中保存即使不定义形参,也可以通过arguments来使用实参,只不过比较麻烦arguments[0]表示第一个实参arguments[1]表示第二个实参。。。arguments中有一个属性:callee,这个属性对应一个函数对象,就是当前正在执行的函数对象*/function fun(){console.log(arguments instanceof Array);console.log(Array.isArray(arguments));console.log(arguments.length);console.log(arguments[0]);console.log(arguments.callee); // fun函数}fun(); // arguments.length = 0fun("hello", true); // arguments.length = 2fun("hello", true); // arguments[0] = "hello"
</script>
<style>
</style>
</head>
<body>
</body>
</html>
关键字:【前端】JavaScript入门及实战76-80

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

责任编辑: