zoukankan      html  css  js  c++  java
  • js01----json,数组

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    
    <script>
    var json = { name : 'leo', age : 32 };
    alert( json.name );  //json是跨平台的。
    
    var arrUrl = [ 'img/1.png', 'img/2.png', 'img/3.png', 'img/4.png' ];
    var arrText = [ '小宠物', '图片二', '图片三', '面具' ];
    //使用json存放
    var imgData = {
        url : [ 'img/1.png', 'img/2.png', 'img/3.png', 'img/4.png' ],
        text : [ '小宠物', '图片二', '图片三', '面具' ]
    };
    alert( imgData.url );//显示整个数组
    alert( imgData.url[2] );
    
    //var json1 = { name : 'miaov' };
    var json2 = { 'name' : 'miaov' };//2种写法一样的,但是加引号是推荐的格式,不会兼容性出现问题
    
    alert( json2.name );//用点不加引号
    alert( json2['name'] );//用中括号,里面要加引号
    json2.name = '妙味';
    json2['name'] = 'miaov';
    alert(json2.name);
    
    var json3 = { abc : 123, xyz : '' };
    //  { [], [], [] }        [ {}, {}, {} ]
    var arr = [ { 'name' : 'TM', 'age' : 23 }, { 'name' : 'leo', 'age' : 32 } ];
    alert( arr[0].name + '今年有' + arr[1]['age']  );//点不加引号,中括号加引号
    
    var json4 = { 'name' : 'miaov', 'age' : 3, 'fun' : '前端开发'  };
    for ( var attr in json4  ) {
         alert( attr );//每一个键值
         alert( json4[attr] );//不加引号,json4['attr']加引号表示获取键为'attr'的值
    }
    
    var json5 = {
        'url' : [ 'img/1.png', 'img/2.png', 'img/3.png', 'img/4.png' ],
        'text' : [ '小宠物', '图片二', '图片三', '面具' ]
    };
    // var arr = [ {}, {}, {} ];
    for ( var attr in json5 ) {//for in 遍历json,attr是每一个键
        for ( var i=0; i < json5[attr].length; i++ ) {//遍历数组用for循环
            alert( json5[attr][i] );
        }
    }
    </script>
    
    
    <script>
    var str = '';
    var num = 0;
    for ( var attr in document ) {//for in遍历对象,for in 是没有1,3,,4数字的,只能够自己加。
        str += num + '. ' + attr + ':' +document[attr] + '<br />';
        num ++;
    }
    document.body.innerHTML = str;
    </script>
    
    
    <script>
    //数组可以用for in 和for循环遍历,json只能用for in  不能够用for循环
    var json = {
        'url' : [ 'img/1.png', 'img/2.png', 'img/3.png', 'img/4.png' ],
        'text' : [ '小宠物', '图片二', '图片三', '面具' ]
    };
    alert(json.length),//json没有长度属性
    for ( var i=0; i < json.length; i++ ) {//json不能用for循环
    
        }
    var arr = [ 'a', 'b', 'c' ];
    for ( var i in arr ) {//i是0,1,2,相当于数组是json的特殊形式,前面默认有键0,1,2,3
        alert( arr[i] );
    }
    </script>
    </head>
    
    <body>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    
    <script>
    
    var arr = [ 1,2,3 ];//2中形式差不多
    var arr = new Array(1,2,3);   //对象的定义方式
    alert( arr );
    
    var arr = new Array();
    arr[1] = 123; //动态添加数据
    
    var arr = new Array(3);//3表示长度是3
    var arr = [3];//长度是1
    
    var arr = new Array('3');
    alert( arr.length );//长度是1
    
    var arr = [ 'aaa',2,3 ];
    alert( arr.length );            // 3
    arr.length = 1;//数组长度可写,长度1则把后面的去掉了。
    arr.length = 0;//长度是0,快速清空数组。
    arr = [];//数组重新复制为空,也是清空数组,效率比length=0效率更高。
    alert( arr );
    
    var str = 'aaaaa';
    // str.length = 1;    字符串的length属性是不可写的
    alert(str);
    
    </script>
    
    
    <script>
    
    var arr = [ 1,2,3 ];
    alert( arr.push( 'abc' ) );  //数组后面添加,push返回值是数组的长度。
    alert( arr );
    alert( arr.unshift( 0 ) );    //前面添加, IE 6  7 不支持 unshift 返回值
    // alert( arr );
    </script>
    
    
    <script>
    
    var arr = [ 'TM', '钟毅', '张森', '杜鹏', 'Leo' ];
    alert( arr.pop() );//后面删除一个,返回值的删除的元素
    alert( arr );
    alert( arr.shift() );//前面删除,返回值是删除的元素
    alert( arr );
    </script>
    
    <script>
    var arr = [ 'TM', '钟毅', '张森', '杜鹏', 'Leo' ];
    arr.unshift(arr.pop());//后面删除一个前面添加
    arr.push(arr.shift())//删除第一个添加到末尾
    alert( arr );
    </script>
    
    <script>
    
    var arr = [ 'TM', '钟毅', '张森', '杜鹏', 'Leo' ];
    // splice :删除、替换、添加
    arr.splice( 1 , 2 )//从第1个位置开始删除2个
    alert(arr.splice( 1 , 2 ))//返回被删除的
    arr.splice( 1 , 1, 'aaa')//从第1个位置开始替换1个aaa
    arr.splice( 0, 2, '莫涛 or 钟毅' );//从0开始替换2个成莫涛 or 钟毅,变成[ '莫涛 or 钟毅', '张森', '杜鹏', 'Leo' ]
    alert( arr.splice( 1 , 1, 'aaaaaa' ) );//返回被删除的
    arr.splice( 1, 0, '钟毅媳妇儿~', '钟毅媳妇们~' ) ;//第一个位置开始,这个位置不删除也不替换,前面添加,[ 'TM','钟毅媳妇儿~', '钟毅媳妇们~', '钟毅', '张森', '杜鹏', 'Leo' ]
    alert( arr.splice( 1, 0, '钟毅媳妇儿~', '钟毅媳妇们~' ) );//什么都没有删除就都没有
    alert( arr );
    
    
    //数组去重
    var arr = [ 1,2,2,4,2,1,3,4 ];
    for ( var i=0; i<arr.length; i++ ) {
        for ( var j=i+1; j<arr.length; j++ ) {
            if ( arr[i] == arr[j] ) {
                arr.splice( j, 1 );
                j--;
            }
        }
    }
    alert( arr );
    </script>
    
    <script>
    //快速排序,希尔排序,冒泡,归并,选择,插入,sort用的是
    var arr = [ 'c', 'd', 'a', 'e' ];
    arr.sort();
    alert( arr );
    
    var arr2 = [ 4,3,5,5,76,2,0,8 ];
    arr2.sort();
    alert( arr2 );//0,2,3,4,5,76,8,默认加引号,按照字符串排序
    arr2.sort(function ( a, b ) {//匿名函数,从数组随机抽出2个数a,b,a-b(76-2=74为正数则交换位置,负数不交换位置,为0则不动)
        return a - b;//从小到大,b-a从大到小,
    });
    alert( arr2 );
    
    var arrWidth = [ '345px', '23px', '10px', '1000px' ];
    arrWidth.sort(function ( a, b ) {
        return parseInt(a) - parseInt(b);
    });
    alert( arrWidth );
    
    </script>
    
    <script>
    //打乱顺序
    var arr = [ 1,2,3,4,5,6,7,8 ];
    arr.sort(function ( a, b ) {
        return Math.random() - 0.5;
    });
    alert( arr );
    alert( Math.random() );
    </script>
    
    
    </head>
    </head>
    
    <body>
    </body>
    </html>
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    
    <script>
    //随机函数
    alert( Math.round(3.4) );//round() 4舍5入
    Math.random()   //0~1 
    Math.round(Math.random());//0、1  
    //0~10
    alert( Math.round(Math.random()*10) );
    // 5~10
    alert( Math.round( Math.random()*5 + 5 ) );
    // 10~20
    alert( Math.round( Math.random()*10 + 10 ) );
    // 20~100
    alert( Math.round( Math.random()*80 + 20 ) );
    
    // x ~ y
    var x = 3;
    var y = 49;
    // alert( Math.round( Math.random()*(y-x) + x ) );
    
    // 0~x
    // alert( Math.round( Math.random()*x) );
    
    // 1~x   ceil向上取整
    alert( Math.ceil( Math.random()*x) );
    
    
    // 课上小练习:
    // 随机产生 100 个从 0 ~ 1000 之间不重复的整数
    // var str = 'aaasdlfjhasdlkfs';
    // indexOf('s') —— 为数组编写该方法:indexOf('img/1.jpg')
    
    </script>
    
    <script>
    //concat 连接数组
    var arr1 = [ 1,2,3 ];
    var arr2 = [ 4,5,6 ];
    var arr3 = [ 7,8,9 ];
    arr1.concat(arr2);
    alert( arr1.concat( arr2, arr3 ) );
    
    var arr1 = [ 1,2,3,4,5,6 ];
    arr1.reverse();//反转
    alert( arr1 );
    
    var str = 'abcdef';
    alert(str.split('').reverse().join(''));//split('')字符转成数组,join('')数组转成字符串,数组元素通过''链接在一起
    </script>
    
    
    </head>
    
    <body>
    </body>
    </html>
  • 相关阅读:
    Java基础语法学习18——方法(2)
    Java基础语法学习17——方法(1)
    Java基础语法学习16——二维数组
    Java8新特性Lambda表达式
    Web编程规范之三层架构设计规范
    Mybatis初体验
    Servlet快速入门:第一个Servlet程序
    Java中常用IO流之文件流的基本使用姿势
    Java中异常关键字throw和throws使用方式的理解
    Java中关于泛型集合类存储的总结
  • 原文地址:https://www.cnblogs.com/yaowen/p/6828733.html
Copyright © 2011-2022 走看看