JavaScript奇淫技巧(一)
时间:2022-05-03
本文章向大家介绍JavaScript奇淫技巧(一),主要内容包括if-else简化写法、清空数组的快速做法、一句话描述“闭包”、i++和++i作为函数参数的区别?、JQuery对象与JS DOM对象相互转化、判断数组中是否存在某对象、初始化二维数组、JS除法会有小数部分、基本概念、基础应用、原理机制和需要注意的事项等,并结合实例形式分析了其使用技巧,希望通过本文能帮助到大家理解应用这部分内容。
if-else简化写法
- 代码中若出现多层if-else嵌套,代码就会显得臃肿不堪,这时可采用替代方案来浓缩代码。
- 常规写法:(臃肿不堪)
if(){
if(){
//……
}
else{
//……
}
}
else{
//……
}
- 简化写法:(一行搞定)
(a) && (b) || (c);
上述表达式含义:若条件a为true则执行表达式b,否则执行表达式c。 原本多行的if-else语句一行就可以搞定。 此外,该句式支持多层嵌套,从而可以实现复杂的条件判断。
- 缺点:这种方式将原本多行的if-else浓缩成一行,可读性大大降低,因此在实际开发中要慎用。虽然逼格很高,很像是大神写的代码,但过一阵子也许你自己都很难读懂。因此,面对高逼格和可读性时你要慎重选择。
清空数组的快速做法
- 常规方法:
var array = [1,2,3,4,5];
array = [];
通常我们采用上述办法,但这种方法有严重缺陷!它实际上并没有清空原本的数组对象! 它创建了一个新的、空的数组对象[],然后将它赋给原本的**数组变量**array,因此原本非空的数组对象并没有清空,而是等待垃圾回收机制处理。
此外,这种方式用在函数中会有风险,示例:
var array = [1,2,3,4,5];
//清空函数方法1
function clearArray1(array){
array = [];
return array;
}
//清空函数方法2
function clearArray2(array){
array = [];
}
array = clearArray1(array);//array为[]
clearArray2(array);//array仍为[1,2,3,4,5]
上述示例定义了两种清空数组的方法,他们都采用给数组赋上[]的方式,clearArray1成功清空数组,而clearArray2却不行。
- 冷门方法: 为了避免上述方法的种种弊端,可以使用以下方式来清空数组:
array.splice(0,array.length);
本方法借助JS提供的splice函数,删除本数组的所有元素。由于splice函数是对数组对象本身进行操作,从而不会出现上述问题。
- 快速方法: 清空数组最简单明了的方式如下:
array.length;
一句话搞定! 由于数组的length属性是一个可读写的值,JS就是通过它来判断当前数组的长度,因此我们完全可以使用它决定当前数组的长度。
一句话描述“闭包”
闭包:当一个函数作为参数传给另一个函数,或作为外层函数的返回值,只要内层函数没有结束,外层函数就不会被销毁,内层函数可以获取外层函数的任意属性。
i++和++i作为函数参数的区别?
function func(i){
alert(i);
}
var i=1;
func(i++);//1
func(++i);//3
这个问题很常规。 i++会先执行后续操作,再进行+1操作,因此函数内部得到的是1; ++i会先+1,再执行后续操作,因此函数得到的是+1后的结果。
JQuery对象与JS DOM对象相互转化
- JQuery——>DOM对象
//现有一个JQuery对象:
$("#id");
//转化成DOM对象
$("#id")[0]
PS:$(“xxx”)返回结果一定是一个数组,即使是根据ID来取。
- DOM对象——>JQuery对象
//现有一个DOM对象:
var dom = document.getElementById("id");
//转化成JQuery对象
$(dom)
判断数组中是否存在某对象
- JS原生indexOf
var array = [obj1, obj2];
array.indexOf(obj1);//若存在返回下标,不存在返回-1
这种方法用的最常用,但某些IE不兼容。
- JQuery inArray
$.inArray(value, array)//若存在返回下标,不存在返回-1
- 自己写一个
if (!Array.indexOf) {
Array.prototype.indexOf = function (obj) {
for (var i = 0; i < this.length; i++) {
if (this[i] == obj) {
return i;
}
}
return -1;
}
}
初始化二维数组
二维数组本质上是一个元素为一维数组的一维数组,因此你首先需要初始化一个一维数组:
var array = [];
再给这一维数组添加一维数组作为元素:
for(var i=0; i<10; i++){
array.push([]);
}
JS除法会有小数部分
JS除法和Java不同,两个整数相除会有小数部分,如果只需整数,则需调用相关函数取整。
//向下取整
parseInt(5/2)
Math.floor(5/2)
//向上取整,有小数就整数部分加1
Math.ceil(5/2)
//四舍五入.
Math.round(5/2)
- 张兴华:云端架构助力企业快速成长
- 腾讯云GAME-TECH沙龙干货回顾:腾讯游戏云全球化实践
- 基于内容关键性的高效 FEC 抗网络丢包算法
- 腾讯云GAME-TECH沙龙干货回顾:三七互娱游戏全球化运营心得分享
- 《实现模式》读书总结
- 腾讯云 GAME-TECH 沙龙干货回顾:Eyougame 海外发行实践分享
- 腾讯 AI Lab 副主任俞栋:过去两年基于深度学习的声学模型进展
- 白辉(七公):电商转型难题,看云如何破题
- 《Node.js在CLI下的工程化体系实践》成都OSC源创会分享总结
- 5分钟教你玩转 sklearn 机器学习(上)
- WebSocket系列之socket.io
- Python 数据分析学习笔记
- ERP管理软件系统设计方案
- 腾讯云GAME-TECH沙龙——全球同服游戏语音解决方案
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- LoRa节点开发——代码详解如何修改发射和接收信道(频率)
- 06 . Kubernetes之Pod控制器详细介绍及应用
- Python面试题
- 08 . Kubernetes之 ingress及Ingress Controller
- cpu占用过高排查
- LoRa节点开发——代码详解LoRaWAN发送与接收数据
- java编程思想第四版第十四章 类型信息习题
- 聊一聊,如何解密、分析LoRaWAN数据包?
- java编程思想第四版第十四章 类型信息总结
- 10 . Python之面向对象
- 11 . Python3之异常,调试和测试
- 张孝祥java高新技术 --- jkd1.5 新特性 -- 精华总结
- 12 . Python3之网络编程
- 01 . Zabbix简介原理及部署
- 03 . Zabbix自定义Key及配置触发器邮件报警