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

本文实例讲述了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.jb51.net/code/HtmlJsRun测试上述代码运行效果。

PS:关于json操作,这里再为大家推荐几款比较实用的json在线工具供大家参考使用:

在线JSON代码检验、检验、美化、格式化工具:
http://tools.jb51.net/code/json

JSON在线格式化工具:
http://tools.jb51.net/code/jsonformat

在线XML/JSON互相转换工具:
http://tools.jb51.net/code/xmljson

json代码在线格式化/美化/压缩/编辑/转换工具:
http://tools.jb51.net/code/jsoncodeformat

在线json压缩/转义工具:
http://tools.jb51.net/code/json_yasuo_trans

更多关于JavaScript相关内容可查看本站专题:《JavaScript中json操作技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

时间: 2019-02-19

JS中的函数与对象的创建方式

创建函数的三种方式 1.函数声明 function calSum1(num1, num2) { return num1 + num2; } console.log(calSum1(10, 10)); 2.函数表达式 var calSum2 = function (num1, num2) { return num1 + num2; } console.log(calSum2(10, 20)); 3.函数对象方式 var calSum3 = new Function('num1', 'num2',

JavaScript封闭函数及常用内置对象示例

本文实例讲述了JavaScript封闭函数及常用内置对象.分享给大家供大家参考,具体如下: 封闭函数 在封闭函数内部定义的函数与外部函数尽管同名也没有关系,同理,定义的变量也可以同名. 封闭函数的写法,一是加括号,一是加感叹号. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>封闭函数</title> &

了解Javascript中函数作为对象的魅力

Javascript赋予了函数非常多的特性,其中最重要的特性之一就是将函数作为第一型的对象.那就意味着在javascript中函数可以有属性,可以有方法, 可以享有所有对象所拥有的特性.并且最重要的,她还可以直接被调用 我们简单的试验一下就可以发现 // 简单实验 函数作为对象的存在 let fn = function () {} fn.prop = 'fnProp' console.log(fn.prop) // fnProp 为函数添加属性的这个特性我觉的大家在平时的开发中基本没什么尝试或者

JS函数动态传递参数的方法分析【基于arguments对象】

本文实例讲述了JS函数动态传递参数的方法.分享给大家供大家参考,具体如下: js函数体内可以通过arguments对象来接收传递进来的参数,利用这一对象属性可以动态传参. function box() { return arguments[0]+' | '+arguments[1]; //得到每次参数的值 } alert(box(1,2,3,4,5,6)); //传递参数 arguments对象的length属性可以得到参数的数量. function box() { return argumen

js的对象与函数详解

一.对象 就是人们要研究的任何事物,不仅能表示具体事物,还能表示抽象的规则,计划或事件.          属性的无序集合,每个属性可以存一个值(原始值,对象,函数) 对象的特性:封装,尽可能的隐藏对象的部分细节,使其受到保护.只保留有限的接口和外部发生联系. js 中{},[] 来定义数组和对象 1.{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数. 2.[ ]中括号,表示一个数组,也可以理解为一个数组对象. 3.{ } 和[ ] 一起使用,我们前面说到,{ } 是一

JavaScript碎片—函数闭包(模拟面向对象)

经过这几天的博客浏览,让我见识大涨,其中有一篇让我感触犹深,JavaScript语言本身是没有面向对象的,但是那些大神们却深深的模拟出来了面向对象,让我震撼不已.本篇博客就是在此基础上加上自己的认知,如有错误,还请见谅. 具体来说实现模拟面向对象主要是利用JavaScript函数闭包这个概念.由于JavaScript中的每一个function都会形成一个作用域,而如果变量声明在这个域中,那么外部是无法直接去访问,要想访问必须new出一个实例来,相当于Java中class.首先让我们来了解一下pr

详解JavaScript中的函数、对象

JS中的函数声明方式 方式一 function 函数名(){ 函数体 } 方式二 var 函数名=function(){ 函数体 } 方式三 var 函数名=new Function("函数体"): 执行方式 函数名(); JS中的对象 类似Java中的一些系统预设好的类 日期对象 function testDate(){ var date=new Date(); //本月中的第几天 document.write(date.getDate()+"<br />&qu

详解JavaScript中的函数声明和函数表达式

JavaScript 中需要创建函数的话,有两种方法:函数声明.函数表达式,各自写法如下: // 方法一:函数声明 function foo() {} // 方法二:函数表达式 var foo = function () {}; 另外还有一种自执行函数表达式,主要用于创建一个新的作用域,在此作用域内声明的变量不会和其它作用域内的变量冲突或混淆,大多是以匿名函数方式存在,且立即自动执行: (function () { // var x = ... })(); 此种自执行函数表达式归类于以上两种方法

详解javascript中的Error对象

概念 error是指程序中的非正常运行状态,在其他编程语言中称为"异常"或"错误",解释器会为每个错误情形创建并抛出一个Error对象,其中包含错误的描述信息: ECMAScript定义了六种类型的错误,除此之外,还可以使用Error构造方法创建自定义的Error对象,并使用throw语句抛出该对象: 六种错误: 1)ReferenceError:引用错误,要用的东西没找到:       2)TypeError:类型错误,错误的调用了对象的方法:       3)R

详解Javascript中的Object对象

Object是在javascript中一个被我们经常使用的类型,而且JS中的所有对象都是继承自Object对象的.虽说我们平时只是简单地使用了Object对象来存储数据,并没有使用到太多其他功能,但是Object对象其实包含了很多很有用的属性和方法,尤其是ES5增加的方法,因此,本文将从最基本的介绍开始,详细说明了Object的常用方法和应用. 基础介绍 创建对象 首先我们都知道,对象就是一组相似数据和功能的集合,我们就是用它来模拟我们现实世界中的对象的.那在Javascript中,创建对象的方

实例详解JavaScript中setTimeout函数的执行顺序

前言 setTimeout,前端工程师必定会打交道的一个函数.它看上去非常的简单,朴实,有着一个很不平凡的名字--定时器.其实网上关于JavaScript中setTimeout的文章很多,但总感觉例子不够直接具体,因此写了个简单的例子并加以解释希望能让大家明白setTimeout是如何执行的.下面话不多说了,来一起看看详细的介绍: 实例代码如下: var time1=new Date().getTime(); console.log(1,time1); setTimeout(function()

详解Javascript 中的 class、构造函数、工厂函数

到了ES6时代,我们创建对象的手段又增加了,在不同的场景下我们可以选择不同的方法来建立.现在就主要有三种方法来构建对象,class关键字,构造函数,工厂函数.他们都是创建对象的手段,但是却又有不同的地方,平时开发时,也需要针对这不同来选择. 首先我们来看一下,这三种方法是怎样的 // class 关键字,ES6新特性 class ClassCar { drive () { console.log('Vroom!'); } } const car1 = new ClassCar(); consol

详解Javascript中prototype属性(推荐)

在典型的面向对象的语言中,如java,都存在类(class)的概念,类就是对象的模板,对象就是类的实例.但是在Javascript语言体系中,是不存在类(Class)的概念的,javascript中不是基于'类的',而是通过构造函数(constructor)和原型链(prototype chains)实现的.但是在ES6中提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6的class可以看作只是一个语法糖,它的绝大部分功能

详解JavaScript中的Object.is()与&quot;===&quot;运算符总结

三重相等运算符 === 严格检查2个值是否相同: 1 === 1; // => true 1 === '1'; // => false 1 === true; // => false 但是,ES2015规范引入了 Object.is(),其行为与严格的相等运算符几乎相同: Object.is(1, 1); // => true Object.is(1, '1'); // => false Object.is(1, true); // => false 主要问题是:什么时

详解JavaScript中的4种类型识别方法

具体内容如下: 1.typeof [输出]首字母小写的字符串形式 [功能] [a]可以识别标准类型(将Null识别为object) [b]不能识别具体的对象类型(Function除外) [实例] console.log(typeof "jerry");//"string" console.log(typeof 12);//"number" console.log(typeof true);//"boolean" console

详解python中groupby函数通俗易懂

一.groupby 能做什么? python中groupby函数主要的作用是进行数据的分组以及分组后地组内运算! 对于数据的分组和分组运算主要是指groupby函数的应用,具体函数的规则如下: df[](指输出数据的结果属性名称).groupby([df[属性],df[属性])(指分类的属性,数据的限定定语,可以有多个).mean()(对于数据的计算方式--函数名称) 举例如下: print(df["评分"].groupby([df["地区"],df["类