本文内容：

  • 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. 开发中常用js记录（三）

    (1)Jquery 判断一个元素下是否有指定的class$('div').is('.classname')$('div').hasClass('redColor') (2)获得窗口长宽等$(windo ...

  2. Django -- 发送HTML格式的邮件

    提前在setting中设置邮箱server from django.core.mai import EmailMessage subject, from_email, to = 'xxx', 'nor ...

  3. 微信小程序自定义navigationBar标题栏

    小程序默认使用的navigationBar只能设置颜色.文字,左侧返回按钮也是不可改变的,若要实现下方效果有解决方案,但是也有一定的问题. 1.更改app.json "window" ...

  4. DWR第二篇之逆向Ajax

    1. 本示例在第一篇架构基础上添加代码 2. 首先修改web.xml里dwr的servlet配置: <!-- 配置dwr请求的servlet --> <servlet> < ...

  5. ftp服务器搭建及简单操作

    ftp服务器搭建及简单操作 1. 添加一个新用户,使用名useradd testftp,然后使用passwd testftp对新添加的用户设置密码(这里设置为“1234567”). 2. 安装ftp服 ...

  6. 【转载】LINUX 和 WINDOWS 内核的区别

    LINUX 和 WINDOWS 内核的区别 [声明:欢迎转载,转载请注明出自CU ACCESSORY http://linux.chinaunix.net/bbs/thread-1153868-1-1 ...

  7. 【原创】空中鼠标一DMP欧拉角

    正在搞六轴传感器,今天移植了MPU6050的MothionDriver的DMP固件到STM32上了,能够稳定地输出欧拉角(也就是俯仰角.航向角.横滚角)和XYZ三轴加速度值,在电脑的上位机模拟了装置的 ...

  8. 【CSS】flex布局初认识

     1. 父容器为Flex容器,它有以下六个属性: 1)flex-direction: 作用:决定主轴的方向(如果为row,那么x方向为主轴:如果为column,那么y方向为主轴) 属性:row | r ...

  9. 完整例子-正则控制input的输入

    转 : https://www.cnblogs.com/ckf1988/p/5619337.html

  10. Go基础系列：Go接口

    接口用法简介 接口(interface)是一种类型,用来定义行为(方法). type Namer interface { my_method1() my_method2(para) my_method ...