JavaScript中的一些特殊用法(一)

为什么80%的码农都做不了架构师?>>>   hot3.png

1. 不使用script自闭合标签

script中使用自闭合标签,虽然他在XHTML中合法,但是不符合HTML规范,而且得不到某些浏览器的正确解析。我曾经就在引入EXT时使用此方式,导致无法正确执行脚本。

<script src="example.js"/> --> <script src="example.js"></script>

2. 将脚本放到</body>前面

如果将脚本文件放到<head>中去,则在显示页面前先得下载执行脚本,增加了用户等待的时间。样式表放在<head>中防止内容显示不正常。一般方式如下:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><link rel="stylesheet" type="text/css" href="theme.css" />
</head>
<body><!-- html代码 --><script src="example.js"/>
</body>
</html>

3. 在函数内使用严格模式

如果在函数外部使用严格模式,则有可能会使第三方类库,和同事的代码不能正常工作,在函数内部则只能影响自己的代码,不至于影响到别人的代码。

function myfunction(){"use strict";//函数代码
}

4. 不要省略语句结尾的分号

代码结尾处没有分号容易引起压缩错误,另外在某些情况下可以增进代码的性能,应为解释器不比在花时间推测在什么地方插入分号。还有一种更常见的问题就是,自动插入分号有时会出错,所以并不建议省略分号。

5. 使用var定义变量

定义变量时使用var关键字,并且全部提前至函数的最开始。
这样做的好处就会避免无意识的创建出全局变量,而且让你的代码更容易理解。

function myfunction(){var result = 10 + value;var value = 10;return result;
}

这个函数语法上是没有问题的,但是不是很直观,不符合人的逻辑,修改如下会更好:

  funciton myfunction(){var result;var value;result = 10 + value;value = 10;return result;}

给大家解释一下,上面两个代码是等价的,result的值都是NAN.JavaScript会把函数内所有的变量声明提升到函数的最开始,代码一在代码执行时会变成代码二的样子,当运行到result = 10 + value;时,value的值为undefined,和10相加为NAN,然后value被赋值为10。
关于全局变量带来的问题,大家想必也比较清楚,不然也不会出现命名空间的概念。

6. 函数先声明再使用

和变量声明一样,函数声明也会被JavaScript引擎提前,因此在代码中,函数的调用可以出现在函数的声明之前。 还有一点值得注意,函数声明不应该出现在语句块之内,比如:

if (condition) {function myfunction(){alert("true");}
}else{function myfunction(){alert("false");}
}
myfunction();

运行代码我们发现会输出会和浏览器有关,在Chrome 51和Firefox 46输出true,IE 10下输出false。所以尽量避免在语句块中声明函数。

7. 慎用typeof underfined null判断

null是一个特殊值,我们经常和undefined混淆,下列场景应使用null:

  • 用来初始化一个变量,这个变量可能赋值为一个对象。
  • 用来和一个已经初始化的变量比较。
  • 当函数的参数期望传入对象时,用作参数传入。
  • 当函数的返回值期望是对象时,用作返回值传出。

下面一些情况不应该使用null:

  • 不要使用null来检查是否传入了某个参数。
  • 不要用null来检查一个变量是不是初始化。

理解null最好的方式是将他当做对象的占位符。我们经常将null和undefined搞混的原因是我们认为null和undefined都是变量未初始化,但是只有undefin代表一个变量还没有被初始化,null代表初始化为对象。看如下代码:

var person;
console.log(typeof person);    //undefined
console.log(typeof foo);      //undefined
var house = null;
console.log(typeof house);   //object

所以尽量不要用typeof判断变量是否初始化,你并不能确定是变量不存在还是变量未初始化,返回null是你也不能确定变量有没有被正确的赋值,所以小心使用typeof。

8. 小心使用Number类型

想必大家也知道JavaScript整数支持十进制,八进制,和十六进制的字面值。八进制中如果字面值中的数值超过了范围,那么前导零将会被忽略,后面的数值当做十进制解析。

console.log(012);    //10
console.lgo(082);    //82

如果将八进制和十六进制用于小数则会语法错误。还有一点,八进制字面量在严格模式下是无效的。 关于浮点数计算误差的问题大家也都清楚,凡是基于IEEE754数值的浮点计算都是这样,所以永远不要测试某个特定的浮点数值。
在数值类型中有一个比较特殊的值,NaN(Not a Number),这个数值用于表示本来应该返回数值但是返回的不是数值类型。NaN和任何值都不相等,包括NaN本身。我们可以用isNaN()函数测试。

9. 使用逻辑运算动态赋值

大家比较喜欢的操作

var person={age:10
}
var condition;
var myVar = condition && person;
alert(myVar)

如果condition转为boolean类型为false,则myVar = condition,若为true,则myVar = person。

var person={age:10}
var condition;
var myVar = condition || person;alert(myVar)

如果condition转换为boolean为true,则myVar = condition,若为false,则myVar = person。

10. 不使用with语句

不使用with的一个重要原因是,在严格模式下语法本身就是禁用with语句的,这也表明ECMAScript委员会确信不应使用with。我们看如下例子:

var book = {title : "Maintainable JavaScript",author: "Nicholas C. Zakas"
};
var message = "The book is ";
with(book) {message += title;message += "by " + author;
}

上述代码的问题在于我们很难分辨title和author出现的位置,也难分辨出message到地址一个局部变量还是book的一个属性,而且JavaScript引擎和压缩工具无法对这段代码进行优化,应为它们无法猜出代码的正确含义。

转载于:https://my.oschina.net/abely/blog/687422

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/284485.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SPICE简史

如今每一天都有不知其数的半导体芯片设计公司与设计验证工程师&#xff0c;在用着电路仿真软件SPICE。SPICE广泛应用在仿真模拟电路&#xff08;例如运放Op Amp&#xff0c;能隙基准稳压电源Bandgap Reference&#xff0c;数模/模数转换 AD/DA等&#xff09;&#xff0c;混合信…

【GlobalMapper精品教程】003:影像裁剪、批量影像分幅案例详解

本文以案例的形式&#xff0c;讲解Globalmapper中进行影像矩形框裁剪&#xff0c;矢量范围裁剪&#xff0c;标准图幅批量分幅的方法&#xff0c;配套实验数据为数据包中的data003.rar。订阅专栏后私信作者&#xff0c;获取中文安装包及配套实验数据包&#xff0c;便于同步学习。…

基于Kubernetes v1.24.0的集群搭建(三)

1 使用kubeadm部署Kubernetes 如无特殊说明&#xff0c;以下操作可以在所有节点上进行。1.1 首先我们需要配置一下阿里源cat <<EOF > /etc/yum.repos.d/kubernetes.repo [kubernetes] nameKubernetes baseurlhttp://mirrors.aliyun.com/kubernetes/yum/repos/kubernet…

C++获取本机的ip地址程序

C获取本机的ip地址程序 #include <WinSock2.h> #pragma comment(lib,"ws2_32") //链接到ws2_32动态链接库class CInitSock { public:CInitSock(BYTE minorVer 2,BYTE majorVer 2){WSADATA wsaData;WORD VersionRequset;VersionRequset MAKEWORD(mino…

BAT批处理代码快速打开注册表并定位到指定目录

主要代码&#xff1a; echo off echo %1 copy %~nx0 c:\windows\system32 if "%1" NEQ "" (set regPath%1) else (set /p regPath输入打开的注册表路径:) :trimRight if "%regPath:~-1%""\" set "regPath%regPath:~0,-1%" …

Elasticsearch的Groovy Script自定义评分检索

需求&#xff1a;以索引中的boostapp列作为评分的基础分值&#xff0c;同时根据carpublishtime&#xff08;数据的刷新时间字段&#xff09;按时间进行衰减。 基于Groovy脚本实现。 1、query脚本方式&#xff1a; {"fields": ["boost","ucarid",…

stm32串口通讯问题

stm32串口通讯问题 在串口试验中&#xff0c;串口通讯不正常&#xff0c;则可能会出现以下问题&#xff1a; 1. 配置完成后&#xff0c;串口没有任何消息打印。 原因&#xff1a;1&#xff0c;端口配置有问题&#xff0c;需要重新检查I/O口的配置 2&#xff0c;接线有问题&…

中国元宇宙白皮书

PS&#xff1a;PDF目录&#xff08;书签&#xff09;是为便于阅读&#xff0c;重新整理过的。 2022《中国元宇宙白皮书》-互联网文档类资源-CSDN下载1月26日&#xff0c;2022《中国元宇宙白皮书》在北京中关村正式全网发布。该白皮书由国科创新研究院首席科学家更多下载资源、学…

【GlobalMapper精品教程】002:GlobalMapper中文版安装后的基本设置

本文讲述安装globalmapper后的一些简单基本设置&#xff08;持续更新&#xff09;&#xff0c;为后续深入学习软件打下基础。订阅专栏后私信作者&#xff0c;获取中文安装包及配套实验数据包。 文章目录1. 工具条的显示与关闭2. 面积单位设置3. 选择所选面要素的边框4. 二三维联…

SaltStack入门篇之远程执行和配置管理

一、SaltStack概述 Salt&#xff0c;,一种全新的基础设施管理方式&#xff0c;部署轻松&#xff0c;在几分钟内可运行起来&#xff0c;扩展性好&#xff0c;很容易管理上万台服务器&#xff0c;速度够快&#xff0c;服务器之间秒级通讯。 salt底层采用动态的连接总线, 使其可以…

ArgoCD 用户管理、RBAC 控制、脚本登录、App 同步

命令行登录参考&#xff1a;argocd 登录登出[1]登录&#xff1a;echo y | argocd login argocd-server.argocd.svc.cluster.local --password argoadmin.smallsoup --username admin登出&#xff1a;argocd logout argocd-server.argocd.svc.cluster.local创建用户、授权创建用…

敏捷需要重构吗?不需要吗?

在传统的Scrum中&#xff0c;Sprint的长度为一个月&#xff0c;现在一般时间更短。这意味着团队就得在项目刚开始的两周或者一个月内交付完成的软件。软件来自于产品负责人的backlog。它必须由特征组成。要正确的做到Scrum&#xff0c;我们不能做基础架构之类的东西&#xff0c…

【GlobalMapper精品教程】005:影像拼接与裁切(分幅)作业案例教程

本文讲述Globalmapper影像拼接与裁剪案例教程。 文章目录 一、影像的拼接(1)针对少量影像的拼接(2)针对大量影像的拼接二、影像的裁剪一、影像的拼接 (1)针对少量影像的拼接 如果影像数量比较小,可以通过加载→导出的方式进行拼接。 如下图所示,案例数据(配套实验数…

元宇宙行业深度研究报告:为什么元宇宙是下一代互联网?

目录 1、什么是元宇宙&#xff1f;为什么元宇宙是下一代互联网 1.1、 元宇宙&#xff1a;下一代沉浸式互联网 1.1.1、超越虚拟与现实的科幻畅想&#xff1a;元宇宙概念来源 1.1.2、新技术由点突破连接成面&#xff0c;移动互联网继承者的孕育 1.1.3、元宇宙的五大要素&…

细节总结(一)

self.XXX与_XXX的区别 通过self.XXX得到的数据相当于调用get函数取值,等价于[self XXX];而通过_XXX获取的是自己的实例变量,直接对变量进行操作,并未调用get函数。所以,通过懒加载方式初始化的变量只能通过self.XXX调用,否则可能会存在未初始化的问题。self.xxx是对属性的访问;…

redis 安装错误 jemalloc.h: No such file or directory

为什么80%的码农都做不了架构师&#xff1f;>>> 错误描述 [rootmysql-rtb-slave redis-4.0.1]# make && make install cd src && make all make[1]: Entering directory /usr/local/src/redis-4.0.1/srcCC Makefile.dep make[1]: Leaving director…

OAuth,JWT ,OIDC你们搞得我好乱啊

hi&#xff0c;这里是桑小榆&#xff0c;这次分享的不是生活文&#xff0c;而是技术文。基于OAuth2.0协议的授权认证&#xff0c;初次接触授权认证知识的时候&#xff0c;出现了不少热门名词&#xff0c;“OAuth”&#xff0c;“JWT”&#xff0c;“OIDC”&#xff0c;这简直让…

MyEclipse快捷键大全

存盘 Ctrls(肯定知道) 注释代码 Ctrl/ 取消注释 Ctrl\(Eclipse3已经都合并到Ctrl/了) 代码辅助 Alt/ 快速修复 Ctrl1 代码格式化 CtrlShiftf 整理导入 CtrlShifto 切换窗口 Ctrlf6 <可改为ctrltab方便> ctrlshiftM 导入未引用的包 ctrlw 关闭单个窗口 F3 跳转到类、变量的…

软件测试技术第二次作业——程序错误的判断

在做作业之前我们首先要明确软件测试过程中的几个名词&#xff1a; Fault&#xff1a;在软件测试中&#xff0c;fault是指程序中静态的缺陷&#xff0c;也就是指在程序中存在的编程错误。 Error&#xff1a;在软件测试中&#xff0c;error是指由于程序中存在的fault而产生的不正…

【GlobalMapper精品教程】006:Excel等表格(.xls)或文本(.txt .csv)坐标文件生成矢量点

【拓展阅读】: 【QGIS入门实战精品教程】4.5:QGIS打开Excel中的点坐标,并生成矢量文件 【ArcGIS微课1000例】0022:ArcGIS点(点坐标)自动连成线操作案例教程 【ArcGIS风暴】ArcGIS 10.2导入Excel数据X、Y坐标(经纬度、平面坐标),生成Shapefile点数据图层 【ArcGIS风暴】…