分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

获取json对象的长度

发布时间:2023-09-06 01:33责任编辑:林大明关键词:jsjson

在我们日常前端开发中,经常会用到ajax请求json数据,而json数据有数组和对象2种表示结构,对象和数组。而获取json数组结构的长度比较容易,但json对象结构的长度就比较麻烦。而本文就是对如何获取json对象的长度进行说明。

在说明如何获取json对象之前,我们需要了解下原生javaScript中的hasOwnProperty()方法,这个方法可以检测一个属性是存在于实例中,还是存在于原型中。只要给定属性存在于对象实例中,才会返回true。来看一个简单的例子。 

// 原型模式创建对象
function Person(){}
Person.prototype.name = ‘jack‘;
Person.prototype.age = 24;
Person.prototype.job = ‘worker‘;
Person.prototype.fun = function(){
akert(this.name);
}
var person1 = new Person();
var person2 = new Person();
alert( perosn1.hasOwnProperty(‘name‘) );//false
person1.name = ‘mark‘;
alert(person1.name); //mark
alert( person1.hasOwnProperty(‘name‘) );//true

在这个例子中,通过使用hasOwnProperty()方法,什么时候访问的是实例属性,什么时候访问的是原型属性就一清二楚了。好,可以进入正题了,先写一个

imgbox.json文件数据:

{
  "imgBox": [
      {"urlSmall":"images/small_1.jpg","urlBig":"images/big_1.jpg"},
      {"urlSmall":"images/small_2.jpg","urlBig":"images/big_2.jpg"},
      {"urlSmall":"images/small_3.jpg","urlBig":"images/big_3.jpg"},
      {"urlSmall":"images/small_4.jpg","urlBig":"images/big_4.jpg"},
      {"urlSmall":"images/small_5.jpg","urlBig":"images/big_5.jpg"}
   ]
}

javaScript部分:

function addPics(){

  $.getJSON(‘/php/imgbox.json‘,function(jsonData){

  console.log(jsonData.imgBox[0].urlSmall);

  // 获取json对象长度的方法
  function getJsonLength(data){
    console.log(data);
    var x ,i = 0;
    for(var i in data.imgBox){
      if(data.imgBox.hasOwnProperty(i)){
        i++;
      }
    }
    return i;
  }

  var count = getJsonLength(jsonData);
  console.log(count);// 获取到的json对象长度为5

  })
}

addPics();

好了,就是这样,希望对前端开发者有一点帮助。

获取json对象的长度

原文地址:https://www.cnblogs.com/baolevel/p/8168617.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved