• JavaScript的进阶之路(三)引用类型之Object类型和Array类型


    引用类型

    Object类型

    function a(num){
    				if(num>3){
    					a(--num);  
    				}
    				console.log(num);   
    			}
    			a(5);
    			//如何创建对象的实例
    			var obj1= new Object();
    			console.log(obj1);
    			obj1.name="吴琼";
    			obj1.age=28;
    			console.log(obj1.name+" "+obj1.age);
    			//对象字面量语法 ,有点封装的感觉
    			var obj2 = {
    				name:"吴琼",
    				age:28
    			};
    			var obj3 = {
    				age:28,
    				age_wo:30
    			};
    			console.log(obj3["age_wo"]);
    			console.log(obj2.name+" "+obj2.age);
    			function show(arg){
    				var s="";
    				if(arg.name != undefined){
    					console.log(arg.name);
    				}else{
    					console.log("没有这个名字");
    				}
    			}
    			show(obj3);
    			show(obj1);
    

      

    Array类型

    ECMAScript中数组中的每一项可以保存任何类型的数据。而且,数组的大小是可以自动调整的。

    设置数组的长度array.length=2;小于数组长度则移除数组中的项,大于数组的长度则添加undefined项

    数组的长度是:array.length;数组最后一项的下标是:array.length-1

    数组的方法

    检测数组

    ECMAScript3 instanceof
    ECMAScript5 Array.isArray() IE9以上支持
    准确检测数组方法:22.1.1

    转换方法

    toString() valueOf() toLocalString() join()

    栈方法:栈是一种后进先出的数据结构。

    push() 返回新数组的长度 pop()返回从数组最后移除的项

    队列方法:先进先出。

    unshift()返回新数组的长度 shift() 返回从数组前端移除的项

    重排序方法:reverse() sort() 他们的返回值是经过重新排序的数组。

    reverse()反转数组项的顺序,但不够灵活 sort()方法默认从小到大排序,原理是调用每一项的toString()方法,然后比较字符串

    操作方法:concat()连接数组 slice()截取数组 splice()删除、插入、替换数组中的项

    concat()创建一个新数组,不影响原数组。
    slice()创建一个新数组,不影响原数组,参数为下标,1个的时候从下标位置到最后,2个的时候第二个下标不包含。
    splice()创建一个新数组,影响原数组。返回从原数组中删除的项,如果没有删除项则返回空数组

    操作方法是否可以理解为:从已知数组中取一些有用的项组成一个新的数组,便于我们去操作呢

    位置方法:IE9+ indexOf() lastIndexOf() 查找特定项在数组中的位置,没有返回-1(判断数组中是否含有某一项)

    ECMA5为数组定义了5个迭代方法:(IE9+)都有2个参数:给定函数和运行该函数的作用域--影响this的值。给定函数有3个参数 项 下标 数组

    1、every() 每一项都符合给定函数则返回true
    2、some() 只要有一项符合给定函数则返回true
    3、filter() 找出符合给定函数的项,组成新的数组
    4、map() 返回运行给定参数的结果,组成新的数组
    5、forEach() 没有返回值,只是对数组中的每一项运行给定函数

    ECMA5缩小方法:(IE9+)reduce() reduceRight() 适用于求值运算

    //关于数组
    			//创建数组和存取数组
    			var arr1=new Array();
    			arr1=[1,2,3];
    			var arr2=[];
    			var arr3=["吴琼",2,"str",{name:"吴琼",age:28}];
    			arr2[0]=1;
    			arr1[3]=4;
    			arr1[arr1.length]=5;
    			console.log(arr1);
    			console.log(arr1[arr1.length-1]);//最后一项的索引始终是length-1
    			console.log(arr2);
    			console.log(arr2[0]);
    			console.log(arr3);
    			console.log(arr3[3].name);
    			if(arr1 instanceof Array){
    				console.log("arr1 是数组");
    			}else{
    				console.log("arr1 不是数组");
    			}
    			if(Array.isArray(arr2)){
    				console.log("arr2 是数组");
    			}else{
    				console.log("arr2 不是数组");
    			};
    			console.log(arr1.toString());
    			console.log(arr1.toLocaleString());
    			console.log(arr1.valueOf());
    			console.log(arr1.join("/"));
    			//alert(arr1.join());  //后台自动调用arr1.toString();
    			console.log(arr1.push(6,7,"8","pop()这个项"));//返回新数组的长度
    			console.log(arr1);
    			console.log( arr1.pop());  //返回取出来的项
    			
    			console.log(arr1);
    			var arr4=new Array();
    			console.log(arr4.unshift(1,2));  //返回新数组的长度 2	
    			console.log(arr4);
    			console.log(arr4.shift());
    			console.log(arr4);
    			console.log(typeof arr4.shift());
    			console.log(arr4);
    			var arr5=[0,5,15,10,20,"a","b",30];
    			console.log(arr5.reverse()); //改变了原数组 
    			console.log(arr5.sort());    //[0,10,15,20,5]  转变为字符串比较后的排序结果
    			console.log(arr5.sort(function(a,b){return a>b}));
    			var colors=[1,2,3];
    			var colors2=colors.concat(4,[5,6]);
    			console.log(colors2);  //返回一个新数组
    			var colors3=colors2.slice(1);    
    			var colors4=colors2.slice(1,5); 
    			var colors5=colors2.slice(1,colors2.length-1);
    			console.log(colors3);
    			console.log(colors4);
    			console.log(colors5);
    			var cars =["奔驰","宝马","奥迪"];
    			var cars1 =cars.splice(0,1);   //删除奔驰
    			console.log(cars);
    			console.log(cars1);
    			var cars2 = cars.splice(0,1,"奔驰","别克");//替换宝马
    			console.log(cars);
    			console.log(cars2);
    			var cars3 = cars.splice(2,0,"大众"); //插入大众
    			console.log(cars);
    			console.log(cars3);
    			var age={name:"wq"};
    			var age1=[{name:"wq"},2,{a:2,b:3}];
    			if(!Array.indexOf){
                 		Array.prototype.indexOf = function(el){
                 		    for (var i=0,n=this.length; i<n; i++){
                 			    if (this[i] === el){
                 				    return i;
                 		        }
                 		    }
                            return -1;
                        }  
                    }
    			console.log(age1.indexOf({name:"wq"}));  //-1
    			console.log(age1.indexOf(2));   //1
    			console.log(arr1.indexOf({a:2,b:3}));//-1
    			
    			var iter=[1,2,3,4,3,2,1];
    			var everyResult = iter.every(function(item,index,array){
    				return item > 2;
    			});
    			console.log(everyResult);
    			var someResult = iter.some(function(item,index,array){
    				return item > 2;
    			});
    			console.log(someResult);
    			var filterResult = iter.filter(function(item,index,array){
    				return item > 2;
    			});
    			console.log(filterResult);
    			var mapResult = iter.map(function(item,index,array){
    				return item > 2;
    			});
    			console.log(mapResult);   //这个返回一个由布尔值组成的数组
    			var mapResult1 = iter.map(function(item,index,array){
    				return item * 2;
    			});
    			console.log(mapResult1);
    			iter.forEach(function(item,index,array){
    				//这里执行一些代码
    				if(array[index]>2){
    					console.log(item);
    				}else{
    					
    				}
    			});
    			console.log(iter);
    			var sum=iter.reduce(function(pre,cur,index,array){
    				return pre + cur;
    			});
    			console.log(sum);
    

      

    仅此杂文,留待后用。
  • 相关阅读:
    v-bind 和v-model 的区别
    解决PC端和移动端自适应问题?
    安全解决将字符串" "转换成换行
    最全的正则表达式-匹配中英文、字母和数字(转)
    vue:style标签中的scoped属性(作用域)和lang属性的介绍
    vue项目main.js文件下import router from './router'默认导入router文件夹下index.js的原因
    VUE修改样式无效
    lodop如何获取打印机名称
    深拷贝和浅拷贝
    Vue.js学习笔记:props传递数据(转)
  • 原文地址:https://www.cnblogs.com/wow1314/p/7559723.html
Copyright © 2020-2023  润新知