JavaScript的基础语法,你真的了解吗?

时间:2021-12-12 16:11:46

这篇文章是在我们熟悉了JS的基础语法后,很少有人去关注的一些细节部分。如果掌握了某些细节也许会对代码的改善有着非凡的作用。也许会使我们的代码更严谨,更高效。

1.if语句的条件

if条件中,括号里是布尔类型的表达式,但你真的了解什么时候是真值,什么时候是假值吗?

下列值被当做假(false):

false;null;undefined;空字符串'';数字0;数字NaN

其它的值都被当做真,包括true、字符串"false",以及所有的对象

2.逻辑运算符

我们都知道,关于逻辑运算符&&是并、||是或。很多人还可以指出JAVA中,&和|是不短路的。但你真的了解JS中的&&和||的运算规则吗?

&&:如果第一个表达式的值为假,那么运算符&&产生它的第一个表达式的值,否则产生第二个表达式的值。

||:如果第一个表达式的值为真,那么运算符||产生第一个表达式的值,否则产生第二个表达式的值。

那么,大家可以猜到下面的代码的输出了吧。

var str = "abc";
alert(true && str); // abc

这可以引申为:当我们尝试从undefined中获得属性时将导致TypeError异常,页面会提示“属性不存在”。但我们使用如下代码就可以避免。

var obj = {
name:"someone",
propoty:{
higth:100,
width:200
}
}
alert(obj.propoty.higth); //
alert(obj.other); // undefined
alert(obj.other.higth); // TypeError
alert(obj.other && obj.other.higth); // undefined

要知道,出现TypeError浏览器是要报错的,而返回undefined是一个值,不会影响程序流程,这对客户来说是非常重要的。

3.typeof运算符

typeof运算符产生的值有'number'、'string'、'boolean'、'undefined'、'function'和'object'。但这里有一个陷阱:如果是一个数组或null,那么结果是'object'。如

alert(typeof null); // object

4.==与===

在我遇到的几乎所有的JS代码中,使用的都是==(恕我见识短浅)。很遗憾,这是有缺陷的。

===和!==会按照你期望的方式工作,如果两边表达式的结果类型一致且拥有相同的值,那么===返回true,!==返回false。但对于==和!=只有在类型一致的时候才会做出正确的判断。如果两边的表达式的结果类型不一直,它们会去做强制类型转换。转换的规则非常复杂,具体可以去搜索相关详述。如下一些例子:

alert('' == '0');           // false
alert(0 == ''); // true
alert(0 == '0'); // true
alert(false == 'false'); // false
alert(false == '0'); // true
alert(false == undefined); // false
alert(false == null); // false
alert(null == undefined); // true
alert(' \t\r\n ' == 0); // true

以上如果使用===,结果都是false。

    注:以上部分例子参考《JavaScript语言精粹》一书。

JavaScript的基础语法,你真的了解吗?的更多相关文章

  1. JavaScript编程:javaScript核心基础语法

    1.javaScript核心基础语法: javaScript技术体系包含了5个内容:          1.核心语言定义:          2.原生对象和雷子对象:          3.浏览器对象 ...

  2. JavaScript 正则表达式基础语法

    前言 正则表达式在人们的印象中可能是一堆无法理解的字符,但就是这些符号却实现了字符串的高效操作.通常的情况是,问题本身并不复杂,但没有正则表达式就成了大问题.javascript中的正则表达式作为相当 ...

  3. JavaScript的基础语法

    对于Javascript的而言没有数据类型的全部都是通过var来定义创建的.比如: <!DOCTYPE html> <html> <head> <meta c ...

  4. JavaScript数据类型 —— 基础语法(2)

    JavaScript基础语法(2) 数据类型 js中有六种数据类型,包括五种基本数据类型(Number,String,Boolean,Undefined,Null),和一种复杂数据类型(Object) ...

  5. JavaScript的基础语法及DOM元素和事件

    一,JavaScript是什么? 1,JavaScript简称:js,是一种浏览器解释型语言,嵌套在HTML文件中交给浏览器解释执行.主要用来实现网页的动态效果,用户交互及前后端的数据传输等. 2,J ...

  6. JavaScript之基础语法

    第一章 javascript语法 一, js代码的引入 方式一:在html页写js代码 <script> alert('hello,world') </script> 方式二: ...

  7. 1&period;JavaScript 教程&colon;基础语法

    简介: JavaScript web 开发人员必须学习的 3 门语言中的一门: HTML 定义了网页的内容 CSS 描述了网页的布局 JavaScript 网页的行为 用法: (1)HTML 中的脚本 ...

  8. JavaScript核心基础语法

    1 什么是JavaScript? 是一种嵌入在网页中的程序段. 是一种解释型语言,被浏览器解释执行. 由Netscape发明,ECMA(欧洲计算机制造商协会)将其标准化. JavaScript借用了J ...

  9. JavaScript面向对象基础语法总结

    1.Javascript的 对象(Object): //例子:var car = { , , }; 2.使用构造函数来创建对象. //例子: var Car = function() { ; ; ; ...

随机推荐

  1. C&plus;&plus;&lowbar;系列自学课程&lowbar;第&lowbar;7&lowbar;课&lowbar;数组&lowbar;《C&plus;&plus; Primer 第四版》

    说到数组,大家应该都很熟悉,在C.Pascal.Java等语言中,都有数组的概念.在C++中也提供了对数组的支持.数组简单来说就是一堆相同 数据类型对象的集合. 这里要把握住两个要点: 相同的数据类型 ...

  2. DataTable Linq Example

    DataTable CreateTable() { DataTable dtable = new DataTable(); DataColumn dc; //MId CId FId PId dc = ...

  3. 深入学习JavaScript&colon; apply 方法 详解&lpar;转&rpar;——非常好

    主要我是要解决一下几个问题: 1.        apply和call的区别在哪里 2.        什么情况下用apply,什么情况下用call 3.        apply的其他巧妙用法(一般 ...

  4. 游戏引擎&sol;GUI的设计与实现-常见GUI架构

    以X Window为代表的客户/服务器架构. X Window通常是指X服务器及封装了通信协议的客户端库.服务器端主要负责输入事件的分发,窗口层次的管理,以及显示输出的处理,其它功能基本上都是在客户端 ...

  5. poj1942 Paths on a Grid

    处理阶乘有三种办法:(1)传统意义上的直接递归,n的规模最多到20+,太小了,在本题不适用,而且非常慢(2)稍快一点的算法,就是利用log()化乘为加,n的规模虽然扩展到1000+,但是由于要用三重循 ...

  6. MSF初体验 - kali linux 入侵XP系统

    最近做某安全竞赛平台的比赛,真正开始接触Metasploit这一渗透神器,同时也是装逼神器(2333-.),下面记录一下初步使用Metasploit的过程.首先在百度百科摘录了一段关于Metasplo ...

  7. C&num; 使用NPOI 实现Excel的简单导入导出

    private void btnImport_Click(object sender, EventArgs e) { DataSet ds = new DataSet(); DataTable dt ...

  8. Codeforces &num;550 &lpar;Div3&rpar; - G&period;Two Merged Sequences(dp &sol; 贪心)

    Problem  Codeforces #550 (Div3) - G.Two Merged Sequences Time Limit: 2000 mSec Problem Description T ...

  9. 【译】12&period; Java反射——类的动态加载和重新加载

    原文地址:http://tutorials.jenkov.com/java-reflection/dynamic-class-loading-reloading.html 博主最近比较忙,争取每周翻译 ...

  10. WPFの操作文件浏览框几种方式

    方式1: 使用win32控件OpenFileDialog Microsoft.Win32.OpenFileDialog ofd = new Microsoft.Win32.OpenFileDialog ...