js函数传值对应位置，参数个数不对不会报错

最新推荐文章于 2022-09-07 23:45:53 发布
原创 最新推荐文章于 2022-09-07 23:45:53 发布 · 969 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#js函数传值对应位置 #参数个数不对不会报错

博客介绍了JS函数传值对应位置的情况，指出当参数个数不对时，虽不会报语法错误，但会导致数据错误，提醒开发者在使用JS函数传值时需注意参数个数。

js函数传值对应位置，参数个数不对不会报语法错误，会导致数据错误

js函数参数的默认值，参数为对象
前端蜗牛君
06-18 1880
比如，上面最后一个函数，定义了 3 个参数，其中有一个参数c指定了默认值，因此length属性等于3减去1，最后得到2。上面两种写法都对函数的参数设定了默认值，区别是写法一函数参数的默认值是空对象，但是设置了对象解构赋值的默认值；上面代码中，函数fetch没有第二个参数时，函数参数的默认值就会生效，然后才是解构赋值的默认值生效，变量method才会取到默认值GET。上面代码中，有默认值的参数都不是尾参数。上面代码中，x参数对应undefined，结果触发了默认值，y参数等于null，就没有触发默认值。
javascript学习——函数
白话机器学习
10-23 1114
JavaScript 有三种声明函数的方法。（1）function 命令function命令声明的代码区块，就是一个函数。function命令后面是函数名，函数名后面是一对圆括号，里面是传入函数的参数。函数体放在大括号里面。上面的代码命名了一个print函数，以后使用print()这种形式，就可以调用相应的代码。这叫做函数的声明（Function Declaration）。（2）函数表达式除了用function命令声明函数，还可以采用变量赋值的写法。这种写法将一个匿名函数赋值给变量。
js调用函数时传入的参数个数与函数定义时的参数个数不符时的操作
黯之無痕的博客
03-25 3323
1.在js中函数没有重载的概念，如果声明了多个重名的函数，不管函数的形参个数是否一样，只有最有一个有效，其他的函数声明都是无效的。比如说声明了两个函数fn()，第一次声明时没有形参，第二次声明时形参有两个，则在调用fn()时不管有没有传入参数，都是调用后声明的那个函数。假如说调用时只传入了1个参数，例如fn(1)，则1会赋给函数的第一个形参，而第二个形参不会赋值，如果有用到，就会当undefine...
c_报错之函数参数个数不匹配/参数之间没用逗号来分隔
xuchaoxin1375的博客
04-20 567
文章目录编译器的报错机制虽然不完美,但还是很有用 编译器的报错机制虽然不完美,但还是很有用 应当耐心:的从报错信息的第一行开始看起,是出错的直接原因:
SpringMVC @RequestBody 参数映射不上，@RequestBody 报错
热门推荐
liuzhenteng521的博客
09-10 2万+
最近代码遇见了一个springmvc中的小问题，算是很基础的东西，同事问我后我有有些迷惑上网找了一些资料后弄清楚了。特此记录一下springmvc注解@requestbody来传递参数映射一个对象。 言归正传问题是这样的： 使用postMan 发送httppost 请求： 最后报错。   报错原因： 在使用postMan发送post请求的时候没有选择如下:     也就是...
调用函数的关键字参数的位置
jimmy_gyn的博客
01-03 1090
调用函数的关键字参数要放在参数列表的后面, 关键字参数放在参数列表的前面会报错 def printPerson( likes, age, name): print('name: %s' % name) print('age: %d' % age) print('likes:', likes) printPerson(name = '小高', age = 13, li
Python函数传参位置关系总结
软件测试老痞
09-06 1098
一般传参的函数 def print_Info(name,age): print('Name: %s' % name) print('Age: %s'%age) print_Info("ljj",15) 带有默认值的传参函数，有默认值的放在后面 def print_Info(name,age=15): print('Name: %s' % name) ...
【Vue】组件间传值及传值校验
看花容易绣花难
09-07 1300
组件间传值及传值校验
vue 函数返回两个值_Vue 开发经验小记（持续更新）
weixin_39983384的博客
12-20 1863
使用 vue 开发过程中遇到的问题或知识点总结，持续更新中…最近更新：2019-11-291.国际化国际化插件：vue-i18n2.强制换行与禁止换行让多行内容显示一行，多余的用...表示white-space : nowrapoverflow: hiddentext-overflow : ellipsis复制代码内容超过宽度时强制换行overflow: hidden;word-wrap:brea...
装饰器-带参数的装饰器动态传值
阿常呓语的专栏
03-07 2419
带参数的装饰器动态传值 ​ 有一个函数，返回字符串类型， 现在需要在这个 字符串上添加链接。或者添加一个 p 标签 ， 这里很容易想到 可以做一个装饰器来完成这个任务。 装饰器实现的简单实现 相信很多的同学，都可以想到，这个还不简单 直接使用带参数的装饰器 不就可以搞定了。 # -*- coding: utf-8 -*- from functools import wraps from typing import Dict """ pip install pysimple-log==0.0.4 """
JS多个函数之间传递参数问题
weixin_33852020的博客
09-07 614
　　JS多个函数之间传递参数的一个重要思想是在页面定义一个隐藏域，当第一个函数请求到数据时候修改隐藏域的值，第二个函数用jQuery的选择器选择页面中隐藏域的值。   比如: 页面中定义一个隐藏的页号。 <!-- 隐藏查询条件的页号 --> <input type="hidden" name="...
js函数参数占位
weixin_44524243的博客
03-29 5440
function func(a,b){ console.log(b+100); } //上方的函数是两个参数 //当我们想调用时，发现两个参数很麻烦，但是又不能只传递一个，函数的参数接收是按照顺序接收的。这时我们可以用这样简写 func(_,70);//_占位 ...
JS中利用正则表达式交换函数的参数位置
reasonandlie的学习笔记
04-14 1562
某百科中看到一个例子，要用正则表达式将函数foo（a,b,c）中的参数位置换为foo（b,a,c），正好又在复习JS的过程中看到了正则表达式的部分，于是考虑用JS来实现这个功能。
JS函数默认参数为对象,调用时不传参报错
MrChkk的博客
10-11 863
updateGrid({resetPage = true, scrollTop = true}) { console.log(resetPage) } this.updateGrid() // 不传参数调用会报错：undefined prop "resetPage" // 正确写法 updateGrid({resetPage = true, scrollTop = true} = {}) { console.log(resetPage) } ...
JS中函数缺少参数的报错
Meskjei的博客
01-18 3135
稍微有过一点JS编程经历的人都知道，JS中的函数，即便是缺少了参数也不会报错，例如 function add(x, y){ return x + y; } console.log(add()); //NaN add函数中并没有传参数，但是可以正常运行不会报错。那如果想要像C/C++或其他一些语言一样在缺少参数的时候会报错该怎么办呢？ ES6规范中允许开发者为函数的参数设置默认值，而这个默认值可...
C语言，函数形参与实参个数不一致问题
Happy_HZW的博客
05-09 2785
C语言，函数形参与实参个数不一致问题 ​ 最近阅读工程代码的时候，同一个函数，不同场景调用时，输入的实参个数不一样，但是编译却没有问题。查看函数的定义，相关的C文件里并没有给形参指定默认值，这就很奇怪了。 ​ 最终，发现在函数相关的头文件里有给形参指定默认值。这就能解释通为什么形参和实参个数不一致，编译能正常通过的问题了。下面是示例代码。 /*parainput.c 文件内容*/ #include <stdio.h> void sum(int a,int b,int c) { int
js函数的位置
Embiid_的博客
04-24 1980
在做练习时写了如上代码，运行时并不报错，但是js失效。得到两种解决方法：----------1--------- &lt;script type="text/javascript"&gt; $(document).ready(function(){ $("#btn1").click(function(){ $("#mydiv").append("&lt;p&gt;hello worl...
javascript（7）——定义函数的两种方式以及使用的时候传入多个参数的情况，arguments和...rest
木子 旭的博客
01-18 806
1.第一种方式定义函数 function abs(x) { if (x >= 0) return x; else return -x; } 2.第二种方式定义函数 var abc = function (x) { if (x >= 0) return x; else return -x; } 3.arguments使用 当使用该函数的时候，传入的参数超过该方法的参数，也不会报错，全部的参数返回arguments数组 functi
JS函数实参和形参参数个数不一致时的处理和后果
weixin_34112181的博客
11-10 4478
2019独角兽企业重金招聘Python工程师标准>>> ...
vue封装axios请求接口，get和post传值方式一致
最新发布
06-11
<think>我们参考引用的内容，特别是引用[1]和引用[2]，来构建一个统一的Axios封装方案。目标是在Vue项目中封装Axios，使得GET和POST请求的传值方式在调用时看起来一致（比如都通过一个`params`对象传递参数），但在内部根据请求方法自动处理参数位置（GET在URL查询字符串，POST在请求体）。但是请注意，实际上，GET请求的参数确实应该放在URL的查询参数中，而POST请求的参数应该放在请求体中。我们的封装目的是让调用者在写代码时不用关心这个区别，而是由封装层自动处理。步骤：1.创建一个Axios实例，配置基础URL和可能的超时时间等。2.请求拦截器：可以在请求前统一处理，例如设置loading状态、添加token等。3.响应拦截器：处理响应数据，例如根据状态码统一处理错误、关闭loading等。4.封装get和post方法，使其调用方式统一（比如都接受两个参数：url和params）。在get方法中，我们将params传递给Axios的params配置；在post方法中，将params作为请求体发送。然而，为了彻底统一调用方式，我们可以将所有的请求都通过一个统一的request方法进行封装，然后根据不同的method来分发。下面是一个示例，我们将创建：-一个request函数，接受method、url、params等参数。-然后对外提供get和post方法，这两个方法内部调用request函数，并传入对应的method。这样，调用者可以这样使用：-service.get(url,params)-service.post(url,params)而内部，request函数会根据method判断：对于GET，将params拼接到URL的查询参数上；对于POST，将params放入请求体。但是注意：GET请求是没有请求体的，所以当为GET方法时，参数必须放在URL中。而POST可以同时有查询参数和请求体吗？实际上是可以的，但我们通常将主要数据放在请求体。为了灵活，我们也可以允许GET请求时，如果传了请求体参数则忽略（或者报错），但这样不好。所以我们规定：-GET请求：参数只作为查询参数-POST请求：参数作为请求体（如果需要同时传递查询参数和请求体，则需要在封装时做特殊处理，但这里为了简化，我们不提供这种复杂情况，如果需要，可以在url中手动添加查询参数）所以我们的封装目标是：-调用者使用get方法时，第二个参数（params）会被转换成查询字符串附加到url后。-调用者使用post方法时，第二个参数（params）会作为请求体发送（JSON格式）。此外，我们还会在请求拦截器中统一添加一些头部（比如Content-Type:application/json）和身份验证信息（如token）。示例代码：```javascript//创建axios实例importaxiosfrom'axios';constservice=axios.create({baseURL:process.env.VUE_APP_BASE_API,//环境变量中的基础URLtimeout:5000//请求超时时间});//请求拦截器service.interceptors.request.use(config=>{//在发送请求之前做些什么//例如，如果有token，则添加到请求头consttoken=localStorage.getItem('token');if(token){config.headers['Authorization']=`Bearer${token}`;}//如果是POST请求，且请求体是对象，则转换为JSON字符串（实际上axios会自动转换，但我们可以确保头部的Content-Type正确）if(config.method==='post'&&config.data){config.headers['Content-Type']='application/json';}returnconfig;},error=>{//对请求错误做些什么console.log(error);returnPromise.reject(error);});//响应拦截器service.interceptors.response.use(response=>{//对响应数据做点什么//例如，根据后端返回的code进行统一处理constres=response.data;if(res.code===200){returnres.data;//我们只返回数据部分}else{//不是200的情况，可以统一处理错误returnPromise.reject(newError(res.msg||'Error'));}},error=>{//对响应错误做点什么console.log('err'+error);returnPromise.reject(error);});//封装request函数functionrequest(method,url,data){if(method.toLowerCase()==='get'){returnservice.request({url,method:'get',params:data//GET请求的参数放在params});}elseif(method.toLowerCase()==='post'){returnservice.request({url,method:'post',data//POST请求的参数放在data（请求体）});}}//封装单独的get和post方法exportfunctionget(url,params){returnrequest('get',url,params);}exportfunctionpost(url,data){returnrequest('post',url,data);}exportdefaultservice;```然后在Vue组件中使用：```javascriptimport{get,post}from'./request';//使用get请求get('/user/list',{page:1,pageSize:10}).then(res=>{console.log(res);}).catch(err=>{console.error(err);});//使用post请求post('/user/login',{username:'admin',password:'123456'}).then(res=>{console.log(res);}).catch(err=>{console.error(err);});```这样，调用者使用get和post方法时，传参的方式都是传递一个对象作为第二个参数，但内部会根据方法自动处理参数的位置。注意：-上面的响应拦截器直接返回了`response.data.data`，这取决于你后端返回的数据结构。如果后端返回的是`{code:200,msg:'成功',data:...}`，那么这样处理可以。但如果结构不同，请相应调整。-在请求拦截器中，我们为POST请求设置了Content-Type为application/json，这样axios就会自动将JavaScript对象转换为JSON字符串。对于GET请求，不需要设置请求体，所以不需要设置Content-Type（axios默认对GET请求不会设置Content-Type，浏览器也不会发送请求体）。另外，引用[3]提到了在main.ts中引入并初始化，我们可以将上面的封装模块化，然后在main.ts中引入并初始化（例如设置基础URL等）。但上面的封装已经将baseURL写在了创建实例的地方，所以可以根据需要调整。例如，我们可以在创建实例时不设置baseURL，然后在main.ts中通过环境变量设置：```javascript//在request.js中constservice=axios.create();//在main.ts中importservicefrom'./request';service.defaults.baseURL=process.env.VUE_APP_BASE_API;```或者按照引用[3]的做法，导出一个初始化函数，在main.ts中调用：```javascript//在request.js中letservice;exportfunctioninstanceInit(){service=axios.create({baseURL:process.env.VUE_APP_BASE_API,timeout:5000});//...然后加上拦截器等}exportfunctionget(url,params){//...使用service发送请求}```但是，为了避免复杂，我们通常直接在一个文件中创建好实例并导出，然后在main.ts中引入（可能只是为全局设置请求拦截器，如添加token）即可，无需调用初始化函数。以上示例代码仅供参考，具体实现需要根据项目需求调整。</think> 以下是在 Vue 中封装 Axios 以统一 GET 和 POST 请求传值方式的实现方案： ### 统一封装的 Axios 实例 ```javascript // utils/request.js import axios from 'axios' // 创建实例 const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, timeout: 10000 }) // 请求拦截器（统一处理传参） service.interceptors.request.use(config => { // 统一添加 token config.headers['Authorization'] = localStorage.getItem('token') || '' // 统一参数处理 if (config.method === 'get') { config.params = config.data // 将 GET 参数赋值给 params } else if (['post', 'put'].includes(config.method)) { config.data = config.data // POST 请求直接使用 data } return config }, error => { return Promise.reject(error) }) // 响应拦截器（统一错误处理） service.interceptors.response.use( response => { const res = response.data if (res.code !== 200) { // 统一错误提示 return Promise.reject(new Error(res.message || 'Error')) } return res }, error => { // 统一网络错误处理 return Promise.reject(error) } ) // 统一请求方法封装 export function request(config) { return service(config) } ``` ### 在 Vue 组件中使用 ```vue <script> import { request } from '@/utils/request' export default { methods: { // GET 请求示例 async fetchData() { try { // 统一传参方式：使用 data 对象 const response = await request({ method: 'get', url: '/api/data', data: { // 统一使用 data 传参 page: 1, size: 20 } }) console.log('GET 响应:', response) } catch (error) { console.error('GET 错误:', error) } }, // POST 请求示例 async submitForm() { try { // 同样使用 data 传参 const response = await request({ method: 'post', url: '/api/submit', data: { // 统一传参接口 username: 'admin', password: '123456' } }) console.log('POST 响应:', response) } catch (error) { console.error('POST 错误:', error) } } } } </script> ``` ### 封装关键点说明 1. **统一传参接口**： - GET 和 POST 均使用 `data` 属性传递参数 - 在请求拦截器中自动转换： - GET：将 `data` 转换为 URL 查询参数 (`config.params`) - POST：保持 `data` 作为请求体传递 2. **拦截器实现的功能**： - 自动添加认证 token - 统一错误处理逻辑 - 响应数据标准化处理 - 支持 loading 状态管理（可在拦截器中扩展） 3. **优势**： - 调用方式统一简化 - 避免 GET/POST 传参差异带来的错误 - 集中管理通用逻辑（认证、错误处理等） - 支持全局超时和基础路径配置 在 Vue3 项目中使用时，建议在 `main.js` 初始化请求实例并挂载到全局属性（参考引用[3]的实现方式）[^3]。此封装方案已处理 GET 参数位置（URL 查询字符串）与 POST 参数位置（请求体）的自动转换问题（参考引用[2]的参数位置差异）[^2]。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值