来讲讲怎样获取到url上所有参数并以对象形式保存，再讲讲JSON解析与序列化

梁木由的前端新气象 2023-03-28 原文

theme: juejin highlight: gi

前言

大家好，我是梁木由，一个有想头的前端，最近呢也在为明年跳槽做复习准备。但我有个朋友呢，打算在年前跳槽，这不这几天正在疯狂面试中，前两天问了我两个问题，说是面试中遇到的。我看了下问题，思考的久久不能自拔，有个大概的模糊的想法，但是呢具体的写法还真没思考出来，于是呢便去查了查,给大家整理了出来

截取字符串参数

如何将url上所有的参数都给获取到，并以对象形式展示

实现步骤

首先需要取得url参数部分
声明一个保存参数的对象
将每对参数进行分割成数组保存
遍历每对参数，再获取键值对，存储到保存参数的对象中
注意需要对中文解码decodeURIComponent

function getQueryStringArgs(){
  // 取得参数字符串并去掉问号
  let params = location.search.length > 0 ? location.search.substring(1) : '',
        // 声明保存参数的对象
        args = {},
        // 保存每对参数
        items = params.length ? params.split('&') : [],
        // 存储键值对
        item = null,
        // 键
        name = null,
        // 值
        value = null,
        len = items.length;
  
  // 遍历每对参数
  for(let i = 0; i < len; i++){
    // 获取键值对
    item = items[i].split('=');
    name = decodeURIComponent(item[0]);
    value = decodeURIComponent(item[1]);
    
    // 将每一对参数都添加到args中
    if(name.length){
      args[name] = value
    }
  }
  return args
}

JSON解析与序列化

相信大家都经常用到JSON对象的两个方法stringify() 与 parse() 那知道他们的完整用法吗

parse

将JSON字符串解析为原生的javascript对象

JSON.parse(text[, reviver])

text 必需传一个有效的 JSON 字符串，要被解析成 JavaScript 值
reviver 可选，一个转换结果的函数，将为对象的每个成员调用此函数，用于在返回结果之前，修改解析生成的原始值

const str  = '{"date":"2023-01-11T03:24:36.398Z","time":"111","aa":null}'

const jsonStr = JSON.parse(str)
console.log(jsonStr) // { date: '2023-01-11T03:24:36.398Z', time: '111', aa: null }

const jsonStr1 = JSON.parse(str,(key, value) => {
  if(key === 'date'){
      return new Date(value)
  }else {
      return value
  }
})
console.log(jsonStr1.date.getFullYear()) //2023

stringify

将JavaScript对象序列化为JSON字符串

JSON.stringify(value[, replacer[, space]])

value 第一个参数，将要序列后成 JSON 字符串的值
replacer 可选。用于转换结果的函数或数组
如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。
如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组
space 可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 也可以使用非数字，如：\t。

value参数

那咱门看第一个demo，JSON.stringify()的基础用法

var obj = {
    date: new Date(),
    time:'111',
    aa:null,
    vv:undefined
}

console.log(JSON.stringify(obj)) // {"date":"2023-01-11T03:24:36.398Z","time":"111","aa":null}

大家发现没，obj.vv通过stringfiy后丢失了，为什么呢，是因为JSON.stringify 在转换过程中会忽略其值未定义的字段。

replacer参数

接下来看第二个demo，replacer参数的用法

参数为函数时，可以对原始值进行修改，在哪可以用到呢，就比如项目当中需要使用JSON.stringify()，但是想保留为定义的字段时，可以先对其进行转化

var obj = {
  date: new Date(),
  time:'111',
  aa:null,
  vv:undefined
}

console.log(
  JSON.stringify(obj, (key,value) => {
    if(typeof value == 'undefined'){
      return true
    }
    return value
  })
)
// {"date":"2023-01-11T06:30:26.702Z","time":"111","aa":null,"vv":true}

参数为数组时只保留 date 属性的值

var obj = {
  date: new Date(),
  time:'111',
  aa:null,
  vv:undefined
}

console.log(
  JSON.stringify(obj,['date'])
)
//{"date":"2023-01-11T06:33:20.772Z"}

space参数

用来控制缩进用的空白字符串，好像实在也没什么鸟用

var obj = {
  date: new Date(),
  time:'111',
  aa:null,
  vv:undefined
}

console.log(
  JSON.stringify(obj,'',2)
)
/*{
  "date": "2023-01-11T06:37:39.995Z",
  "time": "111",
  "aa": null
*/}

console.log(
  JSON.stringify(obj,'',10)
)
/*{
          "date": "2023-01-11T06:38:53.998Z",
          "time": "111",
          "aa": null
*/}

来讲 JSON section br code 数组字符串JavaScript 前端开发

有关来讲讲怎样获取到url上所有参数并以对象形式保存，再讲讲JSON解析与序列化的更多相关文章

Ruby 解析字符串 - 2
我有一个字符串input="maybe(thisis|thatwas)some((nice|ugly)(day|night)|(strange(weather|time)))"Ruby中解析该字符串的最佳方法是什么？我的意思是脚本应该能够像这样构建句子:maybethisissomeuglynightmaybethatwassomenicenightmaybethiswassomestrangetime等等，你明白了......我应该一个字符一个字符地读取字符串并构建一个带有堆栈的状态机来存储括号值以供以后计算，还是有更好的方法？也许为此目的准备了一个开箱即用的库？
ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2
我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i
ruby - 用逗号、双引号和编码解析 csv - 2
我正在使用ruby1.9解析以下带有MacRoman字符的csv文件#encoding:ISO-8859-1#csv_parse.csvName,main-dialogue"Marceu","Giveittohimóhe,hiswife."我做了以下解析。require'csv'input_string=File.read("../csv_parse.rb").force_encoding("ISO-8859-1").encode("UTF-8")#=>"Name,main-dialogue\r\n\"Marceu\",\"Giveittohim\x97he,hiswife.\"\
ruby-on-rails - rails : save file from URL and save it to Amazon S3 - 2
从给定URL下载文件并立即将其上传到AmazonS3的更直接的方法是什么(+将有关文件的一些信息保存到数据库中，例如名称、大小等)？现在，我既不使用Paperclip，也不使用Carrierwave。谢谢最佳答案简单明了:require'open-uri'require's3'amazon=S3::Service.new(access_key_id:'KEY',secret_access_key:'KEY')bucket=amazon.buckets.find('image_storage')url='http://www.ex
ruby - 如何使用 Ruby aws/s3 Gem 生成安全 URL 以从 s3 下载文件 - 2
我正在编写一个小脚本来定位aws存储桶中的特定文件，并创建一个临时验证的url以发送给同事。(理想情况下，这将创建类似于在控制台上右键单击存储桶中的文件并复制链接地址的结果)。我研究过回形针，它似乎不符合这个标准，但我可能只是不知道它的全部功能。我尝试了以下方法:defauthenticated_url(file_name,bucket)AWS::S3::S3Object.url_for(file_name,bucket,:secure=>true,:expires=>20*60)end产生这种类型的结果:...-1.amazonaws.com/file_path/file.zip.A
ruby-on-rails - Rails HTML 请求渲染 JSON - 2
在我的Controller中，我通过以下方式在我的index方法中支持HTML和JSON:respond_todo|format|format.htmlformat.json{renderjson:@user}end在浏览器中拉起它时，它会自然地以HTML呈现。但是，当我对/user资源进行内容类型为application/json的curl调用时(因为它是索引方法)，我仍然将HTML作为响应。如何获取JSON作为响应？我还需要说明什么？最佳答案您应该将.json附加到请求的url，提供的格式在routes.rb的路径中定义。这
ruby - 简单获取法拉第超时 - 2
有没有办法在这个简单的get方法中添加超时选项？我正在使用法拉第3.3。Faraday.get(url)四处寻找，我只能先发起连接后应用超时选项，然后应用超时选项。或者有什么简单的方法？这就是我现在正在做的:conn=Faraday.newresponse=conn.getdo|req|req.urlurlreq.options.timeout=2#2secondsend 最佳答案试试这个:conn=Faraday.newdo|conn|conn.options.timeout=20endresponse=conn.get(url
ruby - 从 Ruby 中的主机名获取 IP 地址 - 2
我有一个存储主机名的Ruby数组server_names。如果我打印出来，它看起来像这样:["hostname.abc.com","hostname2.abc.com","hostname3.abc.com"]相当标准。我想要做的是获取这些服务器的IP(可能将它们存储在另一个变量中)。看起来IPSocket类可以做到这一点，但我不确定如何使用IPSocket类遍历它。如果它只是尝试像这样打印出IP:server_names.eachdo|name|IPSocket::getaddress(name)pnameend它提示我没有提供服务器名称。这是语法问题还是我没有正确使用类？输出:ge
ruby - 获取模块中定义的所有常量的值 - 2
我想获取模块中定义的所有常量的值:moduleLettersA='apple'.freezeB='boy'.freezeendconstants给了我常量的名字:Letters.constants(false)#=>[:A,:B]如何获取它们的值的数组，即["apple","boy"]？最佳答案为了做到这一点，请使用mapLetters.constants(false).map&Letters.method(:const_get)这将返回["a","b"]第二种方式:Letters.constants(false).map{|c
ruby-on-rails - 如果我将 ruby 版本 2.5.1 与 rails 版本 2.3.18 一起使用会怎样？ - 2
如果我使用ruby版本2.5.1和Rails版本2.3.18会怎样？我有基于rails2.3.18和ruby1.9.2p320构建的rails应用程序，我只想升级ruby的版本，而不是rails，这可能吗？我必须面对哪些挑战？最佳答案 GitHub维护apublicfork它有针对旧Rails版本的分支，有各种变化，它们一直在运行。有一段时间，他们在较新的Ruby版本上运行较旧的Rails版本，而不是最初支持的版本，因此您可能会发现一些关于需要向后移植的有用提示。不过，他们现在已经有几年没有使用2.3了，所以充其量只能让更