JavaScript数组、json对象、eval()函数用法实例分析


Posted in Javascript onFebruary 21, 2019

本文实例讲述了JavaScript数组、json对象、eval()函数用法。分享给大家供大家参考,具体如下:

一、JavaScript中的数组

数组使用[]new Array()new Array(count)进行创建

创建数组之后我们可以对其静态初始化,也可以对其动态赋值

数组的常用属性:length

数组的常用方法:toString()join()reverse()push()pop()

<script type="text/javascript">
  //静态初始化
  var myArray = [1,2,3,45,67];
  //获取数组中的个数
  alert("myArray.length="+myArray.length);
  for(var i=0;i<myArray.length;i++){
    alert("myArray["+i+"]="+myArray[i]);
  }
  //动态初始化
  //动态分配5个内存空间,手动赋值之前,系统默认值为undefined
  myArray = new Array(5);
  for(var i=0;i<myArray.length;i++){
    alert("myArray["+i+"]="+myArray[i]);
  }
  //对数组中的元素赋值
  myArray[0]=true;
  myArray[1]=1;
  myArray[2]="guoguo";
  myArray[3]= new Object();
  myArray[4]= new Object();
  myArray[5]= new Object();//虽然声明的时候数组长度为5,但实际上可以存储更多的内容
  for(var i=0;i<myArray.length;i++){
    alert("myArray["+i+"]="+myArray[i]);
  }
  //数组中的常用方法
  var myArray = [1,"abc",true,4.5,16];
  //toString()方法会用英文逗号把数组中的元素连接成字符串
  alert("myArray.toString()="+myArray.toString());//myArray.toString()=1,abc,true,4.5,16
  //join方法,以特殊符号连接数组中的每一个元素,最后生成一个字符串
  var str = myArray.join("-");
  alert("str="+str);//str=1-abc-true-4.5-16
  //反转数组中的元素
  myArray.reverse();
  str = myArray.join("-");
  alert("str="+str);//str=16-4.5-true-abc-1
  //pop()返回数组最右边的元素,并将其删除
  var elt = myArray.pop();
  alert("elt="+elt+",myArray.length="+myArray.length);//elt=1,myArray.length=4
  //push()将元素添加到数组最右边
  //push()和pop()模拟的是栈结构,最后入栈的先出栈
  myArray.push("end");
  str = myArray.join("-");
  alert("str="+str);//str=16-4.5-true-abc-end
</script>

二、JavaScript中的json对象

json对象使用{}进行创建,通常用在不同的语言之间进行数据交换,它是一种轻量级的数据传输格式

java可以在后台拼接json字符串,并将json字符串发送给浏览器,浏览器可以解析json格式的字符串,这样java和javascript就完成了数据传输

<script type="text/javascript">
  //创建json对象
  var user ={userCode:101,
        uerName:"guoguo",
        address:"瓦力瓦力"};
  alert("user.userCode="+user.userCode);//user.userCode=101
  alert("user.uerName="+user.uerName);//user.uerName=guoguo
  alert("user.address="+user.address);//user.address=瓦力瓦力
  //数组中的元素可以是json对象
  var userArray = [{userCode:101,
           uerName:"guoguo",
           address:"瓦力瓦力"},
           {userCode:102,
           uerName:"haha",
           address:"咕噜咕噜"}
          ];
  alert("userArray[1].userCode="+userArray[1].userCode);
  alert("userArray[1].uerName="+userArray[1].uerName);
  alert("userArray[1].address="+userArray[1].address);
</script>

三、JavaScript中的eval()函数

JS中eval()函数的作用是将普通字符串当做js代码来解释执行。

<script type="text/javascript">
  var str = "var i=10;";
  //eval函数的作用:将普通字符串当做js代码解释执行
  window.eval(str);
  alert("i="+i);//i=10
  //eval可以把json字符串转换成json对象,缺点:json变量的名称不可变
  var jsonStr = "var jsonObject = {userCode:'101',userName:'guoguo',age:'16'}";
  window.eval(jsonStr);
  alert("jsonObject.userCode="+jsonObject.userCode);//jsonObject.userCode=101
  alert("jsonObject.userName="+jsonObject.userName);//jsonObject.userName=guoguo
  alert("jsonObject.age="+jsonObject.age);//jsonObject.age=16
  //eval可以把json字符串转换成json对象,json变量的名称可自定义
  jsonStr = "{userCode:'102',userName:'haha',age:'16'}";
  //注意:eval()函数所需的参数必须是"({......})"格式
  var obj = eval("("+jsonStr+")");
  alert("obj.userCode="+obj.userCode);//obj.userCode=102
  alert("obj.userName="+obj.userName);//obj.userName=haha
  alert("obj.age="+obj.age);//obj.age=16
</script>

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

Javascript 相关文章推荐
用ADODB.Stream转换
Jan 22 Javascript
jQuery 表单验证扩展(三)
Oct 20 Javascript
Js基础学习资料
Nov 23 Javascript
js中switch case循环实例代码
Dec 30 Javascript
JQuery中dataGrid设置行的高度示例代码
Jan 03 Javascript
js网页实时倒计时精确到秒级
Feb 10 Javascript
javascript运动详解
Jul 06 Javascript
javascript和jquery实现用户登录验证
May 04 Javascript
关于JSON.parse(),JSON.stringify(),jQuery.parseJSON()的用法
Jun 30 Javascript
js操作table中tr的顺序实现上移下移一行的效果
Nov 22 Javascript
Layui数据表格 前后端json数据接收的方法
Sep 19 Javascript
OpenLayers3实现地图鹰眼以及地图比例尺的添加
Sep 25 Javascript
ES6基础之解构赋值(destructuring assignment)
Feb 21 #Javascript
ES6基础之展开语法(Spread syntax)
Feb 21 #Javascript
ES6基础之默认参数值
Feb 21 #Javascript
微信小程序HTTP接口请求封装的实现
Feb 21 #Javascript
微信小程序控制台提示warning:Now you can provide attr &quot;wx:key&quot; for a &quot;wx:for&quot; to improve performance解决方法
Feb 21 #Javascript
Element-UI中Upload上传文件前端缓存处理示例
Feb 21 #Javascript
详解Puppeteer前端自动化测试实践
Feb 21 #Javascript
You might like
PHP&amp;MYSQL服务器配置说明
2006/10/09 PHP
MySQL连接数超过限制的解决方法
2011/07/17 PHP
PHP中集成PayPal标准支付的实现方法分享
2012/02/06 PHP
关于js和php对url编码的处理方法
2014/03/04 PHP
JavaScript 学习笔记(十一)
2010/01/19 Javascript
javscript对象原型的一些看法
2010/09/19 Javascript
jQuery中setTimeout的几种使用方法小结
2013/04/07 Javascript
Nodejs实现的一个静态服务器实例
2014/12/06 NodeJs
jQuery实现仿美橙互联两级导航菜单效果完整实例
2015/09/17 Javascript
JS实现上下左右对称的九九乘法表
2016/02/22 Javascript
3分钟快速搭建nodejs本地服务器方法运行测试html/js
2017/04/01 NodeJs
初探Vue3.0 中的一大亮点Proxy的使用
2018/12/06 Javascript
vue中轮训器的使用
2019/01/27 Javascript
浅谈layer弹出层按钮颜色修改方法
2019/09/11 Javascript
解决vue的touchStart事件及click事件冲突问题
2020/07/21 Javascript
Python import用法以及与from...import的区别
2015/05/28 Python
Python 类的继承实例详解
2017/03/25 Python
Python简单实现socket信息发送与监听功能示例
2018/01/03 Python
python爬取cnvd漏洞库信息的实例
2019/02/14 Python
python 用所有标点符号分隔句子的示例
2019/07/15 Python
python深copy和浅copy区别对比解析
2019/12/26 Python
Python 生成VOC格式的标签实例
2020/03/10 Python
jupyter lab的目录调整及设置默认浏览器为chrome的方法
2020/04/10 Python
用CSS3实现Win8风格的方格导航菜单效果
2013/04/10 HTML / CSS
CSS3自定义滚动条样式 ::webkit-scrollbar的示例代码详解
2020/06/01 HTML / CSS
ALDI奥乐齐官方海外旗舰店:德国百年超市
2017/12/27 全球购物
印度和世界各地的精美产品:Ikka Dukka
2018/02/12 全球购物
介绍一下Ruby的特点
2013/01/20 面试题
自考毕业生自我鉴定
2013/11/04 职场文书
数控专业应届生求职信
2013/11/27 职场文书
个人授权委托书样本
2014/09/13 职场文书
校园文化艺术节宣传标语
2014/10/09 职场文书
家庭暴力离婚起诉书
2015/05/18 职场文书
同意转租证明
2015/06/24 职场文书
python绘制简单直方图(质量分布图)的方法
2022/04/21 Python
java实现自定义时钟并实现走时功能
2022/06/21 Java/Android