javascript_lesson3_引用类型
来源：互联网 发布：叶紫涵网络直播 编辑：程序博客网 时间：2024/06/07 05:25
**学习目标
掌握数组的概念、特性、常用方法
掌握Object，学会使用对象
了解其他引用类型对象**
3.1 数组
在ECMAScript中数组是非常常用的引用类型了。ECMAScript所定义的数组和其他语言中的数组有着很大的区别。那么首先要说的就是数组也是一种对象。
特点： “数组”即一组数据的集合。 js数组更加类似java的容器。长度可变，元素类型也可以不同！
数组长度随时可变！随时可以修改！（length属性） 常用方法： push、pop shift、unshift splice、slice
concat、join、sort、reverse等 对于ECMAscript5这个版本的Array新特性补充： 位置方法：indexOf
lastIndexOf 迭代方法：every filter forEach some map 缩小方法：reduce
reduceRight
3.2 Object
我们目前为止大多数引用类型都是Object类型的实例，Object也是ECMAScript中使用最多的一种类型（就像java.lang.Object一样，Object类型是所有它的实例的基础）。
Object类型的创建方式、使用 对于Object类型应用for in 枚举循环 Object每个实例都会具有下列属性和方法：
Constructor: 保存着用于创建当前对象的函数。（构造函数）
hasOwnProperty(propertyName):用于检测给定的属性在当前对象实例中(而不是原型中)是否存在。
isPrototypeOf(Object): 用于检查传入的对象是否是另外一个对象的原型。
propertyIsEnumerable(propertyName):用于检查给定的属性是否能够使用for-in语句来枚举。
toLocaleString()：返回对象的字符串表示。该字符串与执行环境的地区对应. toString():返回对象的字符串表示。
valueOf():返回对象的字符串、数值或布尔表示。
3.3 其他引用类型对象
单体对象： Global对象（全局）这个对象不存在，无形的对象 其内部定义了一些方法和属性：encodeURI
、encodeURIComponent、decodeURI、decodeURIComponent、eval、parseInt、parseFloat、isNaN、Escape、
unescape Math对象 内置的Math对象可以用来处理各种数学运算 可以直接调用的方法：Math.数学函数（参数）
求随机数方法：Math.random(),产生 [0，1) 范围一个任意数 Date对象 获取当前时间的一系列详细方法
基本包装类型：Boolean、String、Number和java的用法类似 Function类型、RegExp类型（以后学习）
//<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript" charset="utf-8"> //js中的数组类似于java里的map容器，长度可以改变，元素类型任意// var arr = [1,2,3,4,true,'abc',new Date()];// alert(arr.length);// alert(arr);// arr.length = 5;// alert(arr.length);// alert(arr);// var arr = [new Date(),false];// var result = arr.push(1,2,true);// alert(arr);// alert(result); /** * push和pop方法 */// var obj = arr.pop();//从数组的尾部移除一个元素// alert(arr);// alert(obj); /** * shift unshift方法 */ // var arr = [1,2,3,true,new Date()];// var r1 = arr.shift(10);//从头部移除一个元素（返回移除的元素）// alert(arr);// alert(r1);//移除的结果// var r2 = arr.unshift(10,false);//从头部插入多个元素（返回新数组的元素长度）// alert(arr);// alert(r2); /** * splice,slice方法 * 操作数组本身 */ //splice:第一个参数：起始位置 // 第二个参数：表示截取个数 // 第三个参数以后表示追加的新元素个数// var arr = [1,2,3,4,5];// arr.splice(1,2,3,4,5);//134545// alert(arr); //slice不操作数据本身// var arr = [1,2,3,4,5];// var temp = arr.slice(2,4); //截取范围（左闭右开区间）// alert(arr);// alert(temp); //3,4 //操作数组的方法：concat join// var arr1 = [1,2,3];// var arr2 = [true,4,5]; //不操作数组本身// var temp = arr1.concat(arr2);// alert(arr1);// alert(arr2);// alert(temp);// var temp = arr1.join('-');// alert(temp); var arr1 = [242,2,3,43,5]; var arr2 = [10,2,4,1,7]; /* * sort正序排序 * reverse倒序排序 * 按字符串排序 ，不是按数值 * */// arr1.sort();// alert(arr1);// arr2.reverse();// alert(arr2); /** * 自定义排序方法 * @param {Object} value1 * @param {Object} value2 */ function compare(value1,value2) { if(value1 < value2) { -1; } else if (value1 > value2) { return 1; } else { return 0; } } arr2.sort(compare); alert(arr2); </script> </head> <body> </body></html>//ECMA5新特性<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript" charset="UTF-8">// var arr = [1,2,3,4,5,4,3,2,1]; //var index = arr.indexOf(4); //1个参数的时候表示传值，返回索引（从0开始）位置 //var index = arr.indexOf(4,4);//从第4个位置开始向后查，4这个值的位置 //alert(index); //lastIndexOf// var index = arr.lastIndexOf(2); //从后向前查找// alert(index); //5个新加迭代的方法 //every:对于数组每一个元素进行一个函数的运行，如果都返回true最后则返回true,如果有一项返回false,则返回false /*var arr = [1,2,3,4,5,4,3,2,1]; var result = arr.every(function(item,index,array){ return item > 2; }); alert(result);*/ //filter:对于数组的每一个元素进行一个函数的运行 给定的函数去执行 把过滤后的结果返回// var arr = [1,2,3,4,5,4,3,2,1];// var result = arr.filter(function(item,index,array){// return item > 2;// });// alert(result); //forEach:循环数组每一项的值 并执行一个方法// var arr = [1,2,3,4,5,4,3,2,1];// arr.forEach(function(item,index,array){// alert(item);// }); //map 对于数组的每一个元素进行一个函数的运行 可以经过函数执行完毕后把新的结果返回// var arr = [1,2,3,4,5,4,3,2,1];// var result = arr.map(function(item,index,array){// return item* 2;// });// alert(result);// var arr = [1,2,3,4,5,4,3,2,1];// var result = arr.some(function(item,index,array){// return item >= 555;// });// alert(result);// // 前一个值，当前值，索引位置，array// var arr = [1,2,3,4,5,4,3,2,1];// var result = arr.reduce(function(prev,cur,index,array){// return prev + cur;// });// alert(result); var arr = [1,2,3,4,5,4,3,2,1]; //从右向左依次遍历 var result = arr.reduceRight(function(prev,cur,index,array){ return prev + cur; }); alert(result); </script> </head> <body> </body></html>//引用类型<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript" charset="UTF-8"> //Object所有类的基础类 //var obj = new Object; var obj = {}; //实例化对象 //给对象设置属性 obj.name = '张3'; obj.age = 20; obj.sex = '男'; obj["birthday"] = '1980-08-07'; obj.say = function(){ alert("hello world"); }; //访问对象的属性和方法 //obj.say(); //删除对象属性 //delete操作符 删除对象的属性或方法的// delete obj.sex;// delete obj.say;// // alert(obj.sex);//undefined //如何去遍历一个js对象 for in 语句式// for(var attribute in obj){// alert(attribute + ":" + obj[attribute]);// } //constructor保存对象的创建函数// alert(obj.constructor);// var arr = [];// alert(obj.constructor); //hasOwnProperty(propertyName)用于检测给定属性在对象中是否存在 //alert(obj.hasOwnProperty('name')); //alert(obj.propertyIsEnumerable('name'));//该属性是否可以被枚举 </script> </head> <body> </body></html>//js实现Map容器<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript" charset="UTF-8"> //模拟java里的Map function Map(){ var obj = {};//空的对象容器 //put方法 this.put = function(key,value){ //private obj[key] = value; } //size方法获得map容器的个数 this.size = function(){ var count = 0; for(var attr in obj){ count++; } return count; } //get方法根据key取得value this.get = function(key){ if(obj[key] || obj[key] === 0 || obj[key] === false){ return obj[key]; } else { return null; } } //remove删除方法 this.remove = function(key){ if(obj[key] || obj[key] === 0 || obj[key] === false) { delete obj[key]; } } //eachMap遍历map容器的方法 this.eachMap = function(fn){ for(var attr in obj) { fn(attr,obj[attr]); } } } var m = new Map(); m.put('01','abc'); m.put('02',120); m.put('03',true); m.put('04',new Date());// alert(m.size());// alert(m.get('03'));// m.remove('03');// alert(m.get('03')); m.eachMap(function(key,value){ alert(key + ":" + value); }); </script> </head> <body> </body></html><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript" charset="UTF-8"> //去除重复数据 var arr = [2,1,2,10,2,3,5,5,5,1,1,10,13]; //js对象特性 : 在js对象中key是永远不会重复的// obj.name = 'z3';// obj.age = 20;// // obj.name = 'w5';// alert(obj.name); //1.把数组转成一个js的对象 //2.把数组中的值，变成js对象当中的key //3.把这个对象 再还原成数组 function toObject(arr){ var obj = {};//私有的对象 var j; for(var i = 0,j=arr.length; i < j;i++) { obj[arr[i]] = true; } return obj; } //把这个对象转成数组 function keys(obj){ var arr = [];//私有对象 数组 for(var attr in obj){ if(obj.hasOwnProperty(attr)) arr.push(attr); } return arr; } //综合利用上述2个方法，去掉数组中的重复项 function uniq(newarr) { return keys(toObject(newarr)); } alert(uniq(arr)); </script> </head> <body> </body></html>//单体对象的使用<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript" charset="UTF-8">// var uri = 'http://blog.csdn.net/wwww_com/article/details/52166668' //Global全局的 终极的对象 （不存在的）// var str1 = encodeURI(uri);// var str2 = encodeURIComponent(uri);// alert("str1: " + str1 +"\n str2:" + str2); //encodeURI encodeURIComponent //decodeURI decodeURIComponent// decodeURI(str1);// decodeURIComponent(str2); //解码 //eval(string) 方法 无形的javascript 解析器// var str1 = "var a = 10;var b = 20;";// eval(str1);// alert(a +":" + b) //数组字符串 直接使用：eval(stringarr); // {name:z3,age:20}// var strobj = "{name:'z3',age:20}";// var obj = eval('(' + strobj + ')');// // alert(obj.name); //parseInt 将字符串的数字值 转为INT类型的值// var num1 = parseInt('20');// var num2 = parseFloat('20.5');// // alert(num1 + ':' + num2);// alert(typeof num1);// alert(typeof num2); //escape unescape URI 转码解码，中文// var str1 = '中国IT社区';// var str2 = escape(str1);// alert(str1 + ":" + str2)// // var str3 = unescape(str2);// alert(str1 + ":" + str3);// isNaN //如果不是 number类型 true是number类型false //在js里面只有NaN自己不等于自己本身的 var num1 = '20'; var num2 = 'abcd10e';// alert(isNaN(num1)); //是一个number类型 返回false// alert(isNaN(num2)); //不是一个number 返回true// if(NaN == NaN){// alert("相等");// } else {// alert("不相等");// } //Date日期类型 var date = new Date();// alert(date);// var year = date.getYear(); //116 var year = date.getFullYear();//2016// alert(year); var month = date.getMonth() + 1; var da = date.getDate(); var hours = date.getHours(); var min = date.getMinutes(); var se = date .getSeconds(); var day = date.getDay();//星期 document.write('今天是' + year + "年" +month+"月" + da + "日 " + hours + "时" + min + "分" + se + "秒 星期" + day); </script> </head> <body> </body></html> 0 0
- javascript_lesson3_引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- 引用类型
- js字符串转化数据
- __ATTRIBUTE__
- linux文件权限与目录配置
- POJ 2486Apple Tree （树形dp）
- Java算法——求三个数中的最大值（或最小值），5种方法
- javascript_lesson3_引用类型
- 判断1-100以内的素数
- 解决ubuntu14 无法CIFS挂载window共享文件
- android 内存与缓存的理解
- tomcat7集群(session复制)
- Scala入门之高级类型:this.type
- 初识spring(十二)
- Some useful DevOPS commands
- php中的pdo操作mysql事务处理实例
