本文内容：

  • javascript的变量
  • javascript的数据类型
  • javascript的运算符
  • javascript的流程结构

首发日期：2018-05-09

javascript的变量

创建变量:

全局变量：全局变量是在js代码的各个地方都能调用的变量

  • 【不在{}内时】var 变量名 = 值；
  • 【不论在不在{}内】 变量名 = 值；

局部变量：局部变量是仅仅在函数体内生效的变量

  • 【在{}内】var 变量名 = 值；
  • 【函数的参数变量也是一种局部变量】

作用域：

  • 函数体内，同名的变量，局部变量优先级高于全局变量
  • 局部变量在函数外无法调用；
  • 嵌套函数中，外层函数无法调用内层函数的局部变量，内存函数可以调用外层函数的局部变量

补充：

  • 变量的作用域是一个大坑，还有什么作用域链问题、生命周期问题【比如，函数名跟某一个变量同名时的优先级也是一个不一般的问题】。使用要注意。由于这里是一个简单的记录，所以不记录那么复杂的东西。

javascript的数据类型

  • javascript是动态类型的语言，它统一使用var来声明每一个对象，每一个对象的数据决定它是一个什么样的数据类型。
  • 所以下面主要介绍数据类型跟变量的关系

数值型：

  • number:普通的数字，可以有用八、十、十六等进制来表示，可以是浮点数。

字符型：

  • string:被""或''包裹的字符

布尔型：

  • boolean:有两个值，一个是true,一个是false;

引用型：

  • undefined：声明了变量，但未进行赋值初始化的变量。
  • object:表明变量是一个对象；当变量赋值null时代表是一个空对象.

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8" />

    <title>Document</title>

    <script>

        function f1(){

            var test=6;//Number

            var a="7";//String

            var b=true;

            var c;

            var d=null;

            var e={'name':"lilei"};

            console.log(typeof(test));//number

            console.log(typeof(a));//string

            console.log(typeof(b));//boolean

            console.log(typeof(c));//undefined

            console.log(typeof(d));//object

            console.log(typeof(e));//object

        }

    </script>

</head>

<body>

    <input type="button" value="点击" onclick="f1()">

</body>

</html>

补充：

  • 字符串的转义问题：在字符串中可以有些字符具有特定的意义，比如\n显示到网页中时会变成换行符。如果想要“不使用那个特别的意义”，需要在这些特别的字符前面加\

  • typeof(变量名)可以返回变量的数据类型。

javascript的运算符

算数运算符：

  • +加法运算符

    • 加法运算符除了数值相加的功能外，还可以拼接字符串，比如"a"+"b"结果是"ab"，7+"a"结果是"7a"。
  • -减法运算符
  • *乘法运算符
  • /除法运算符
  • %求余运算符
  • +=加法赋值运算符、-=减法赋值运算符、*=乘法赋值运算符、/=除法赋值运算符、%=求余赋值运算符

自增、自减运算符：

  • ++：自增运算符，在自己数值的基础上进行加一

  • --：自减运算符，在自己数值的基础上进行减一
  • 自增、自减运算符可以位于变量之前【先自增，再取值】，也可以位于变量之后【先取值，再自增】，

关系运算符：

  • <=    :不大于运算符，比如a <= b，如果a不大于b，那么返回true,否则返回false

  • <      : 小于运算符
  • >      :大于运算符
  • >=    ：不小于运算符
  • ==    ：等于运算符
  • !== :不等于运算符
  • 比较规则：
    • 数值之间：直接比较数值大小

    • 一个是数值：把另一个转换成数值
    • 字符串之间：比较它们之间的unicode数值大小
    • 字符串与非数值：把非数值转成字符串
    • 其他。。。

逻辑运算符：

  • !   :逻辑非运算，把结果取反，返回结果是布尔值，

  • &&  :逻辑与运算，返回结果是布尔值，
  • ||  ：逻辑或运算，返回结果是布尔值

位运算符：

  • ~:按位非

  • &按位与
  • |按位或
  • ^按位异或
  • <<位左移运算
  • >>带符号右移运算
  • >>>无符号右移运算

其他运算符：

  • ?:   :这是一个三目运算符，表达式 (expr1) ? (expr2) : (expr3)。在 expr1 求值为 TRUE 时的值为 expr2，在 expr1 求值为 FALSE 时的值为 expr3。

javascript的流程结构

循环结构：

  • while结构

    • while(条件表达式){循环执行代码段}

  • do-while结构
    • do{循环执行代码段}while(条件表达式);

    • do-while循环不管初始条件是否成立都会执行一次
  • for结构
    • for (循环变量=初值;循环条件;计数器){循环执行代码段}

  • for-each结构
    • for (循环变量 in 集合){循环执行代码段}

选择结构

  • if

    • if(条件表达式1){条件表达式1为真时执行的代码}else if(条件表示2){条件表达式2为真时执行的代码}else{前面的条件都不符合时执行的代码}

    • else if 和else是可选的
  • switch
    • switch(值){ case 值1:代码段;break;case 值2:代码段;break;case 值3:代码段;break;……default:代码段;}

结束语句：

  • return：结束return 所在函数体的运行。并返回return 后面跟着的值。

  • break：结束break所在的循环。break也可以在switch用来跳出选择，没有break时会向下执行另外一个case。
  • continue：在continue的位置提前结束本次循环，然后执行下一次循环判断。

【粗糙版】javascript的变量、数据类型、运算符、流程结构的更多相关文章

  1. JAVA 变量 数据类型 运算符 知识小结

    ---------------------------------------------------> JAVA 变量 数据类型 运算符 知识小结 <------------------ ...

  2. php入门 数据类型 运算符 语言结构语句 函数 类与面向对象

    php PHP-enabled web pages are treated just like regular HTML pages and you can create and edit them ...

  3. Java 语言基础 (初识Java语言, 变量和数据类型, 运算符, 流程控制语句, 数组)

    初始 Java 语言 Java SE -- Java Platform, Standard Edition 是 Java 平台的基础 Java SE 以前称为 J2SE, 可以编写桌面应用和基于 we ...

  4. JavaScript--总结一（变量+数据类型+运算符）

    JavaScript是什么? 是一门脚本语言(不需要编译,直接执行) 是一门解释性语言 是一门动态类型的语言 是一门基于对象的语言 JavaScript分为三个部分 1.ECMAScript  标准- ...

  5. JavaScript判断变量数据类型

    一.JS中的数据类型 1.数值型(Number):包括整数.浮点数. 2.布尔型(Boolean) 3.字符串型(String) 4.对象(Object) 5.数组(Array) 6.空值(Null) ...

  6. javascript的变量声明、数据类型

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. javascript的变量声明和数据类型

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. Javascript开发技巧(JS中的变量、运算符、分支结构、循环结构)

    一.Js简介和入门 继续跟进JS开发的相关教程. <!-- [使用JS的三种方式] 1.HTML标签中内嵌JS(不提倡使用): 示例:<button onclick="javas ...

  9. JavaScript 基础 (变量声明, 数据类型, 控制语句)

    创建: 2017/09/16 更新: 2017/09/24 更改标题 [JavaScript 概要]-> [JavaScript 基础] 完成: 2017/09/25 更新: 2017/10/0 ...

随机推荐

  1. springBoot(7)---整合Mybaties增删改查

    整合Mybaties增删改查 1.填写pom.xml <!-- mybatis依赖jar包 --> <dependency> <groupId>org.mybati ...

  2. 微软Cloud+AI本地化社区贡献指南

    本文主要介绍微软Cloud+AI本地化社区,以及通过多种途径贡献本地化的操作指南. 什么是本地化社区 Cloud+AI本地化社区是微软技术社区的组成部分之一,负责对微软官方技术文档本地化的支持工作.微 ...

  3. 在微信小程序中使用图表

    前言:网上有许多的图表库,如:Echarts.Tau Charts.ChartJS等等,具体自行百度. 这次我们使用的是:Echarts 官方教程:点击查看 Echarts下载地址:飞机直达 1.下载 ...

  4. java泛型【收藏】

    什么是泛型? 泛型(Generic type 或者 generics)是对 Java 语言的类型系统的一种扩展,以支持创建可以按类型进行参数化的类.可以把类型参数看作是使用参数化类型时指定的类型的一个 ...

  5. [NewLife.XCode]事务处理（算准你的每一分钱）

    NewLife.XCode是一个有10多年历史的开源数据中间件,支持nfx/netstandard,由新生命团队(2002~2019)开发完成并维护至今,以下简称XCode. 整个系列教程会大量结合示 ...

  6. 第3章 NFS基本应用

    1.1 概述 类似ext家族.xfs格式的本地文件系统,它们都是通过单个文件名称空间(name space)来包含很多文件,并提供基本的文件管理和空间分配功能.而文件是存放在文件系统中(上述名称空间内 ...

  7. python模块之xml

    xml模块 xml结构 xml是种实现不同语言或程序之间进行数据交换的协议,跟json差不多,但没json使用简单.但是因为历史遗留问题,至今很多行业依然使用xml这种数据格式. xml的格式如下,是 ...

  8. 集成腾讯位置服务到webapi

    经纬度转换为详细地址信息 参考文档:http://lbs.qq.com/webservice_v1/guide-gcoder.html 首先申请key,如果使用的是服务端请求webservice AP ...

  9. c# nginx 配置

    listen ; #端口 server_name localhost; #域名可以有多个 用空格隔开 #charset koi8-r; #access_log logs/host.access.log ...

  10. 在JS方法中返回多个值的三种方法（转载）

    来源:https://www.cnblogs.com/gxsyj/p/6004574.html 在使用JS编程中,有时需要在一个方法返回两个个或两个以上的数据,用下面的几种方法都可以实现: 1 使用数 ...