Javascript基本语法

2018-09-13  本文已影响0人  咻咻咻滴赵大妞

一个完整的JavaScript实现包含了三个部分：

JS的特点：

JS代码需要编写到script标签中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HelloWorld</title>
     <!--JS代码需要编写到script标签中-->
    <script type="text/javascript">
    /*控制浏览器弹出一个警告框*/
         alert("宁姐，你真漂亮！！");
    /*让计算机在页面中输出一个内容document.write()可以向body中输出一个内容*/
        document.write("看我出不出来~~~");
    /*向控制台输出一个内容console.log()的作用是向控制台输出一个内容*/
        console.log("你猜我在哪出来呢？");
</script>
</head>
<body>

</body>
</html>

script标签一旦用于引入外部文件了，就不能再编写代码了，即使编写了浏览器也会忽略
如果需要则可以再创建一个新的script标签用于编写内部代码

<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript">
    alert("我是内部的JS代码");
</script>

JS注释

语法规范

1.JS中严格区分大小写
2.JS中每一条语句以分号(;)结尾
- 如果不写分号，浏览器会自动添加，但是会消耗一些系统资源，
- 而且有些时候，浏览器会加错分号，所以在开发中分号必须写
3.JS中会忽略多个空格和换行，所以我们可以利用空格和换行对代码进行格式化

字面量和变量

a = 123;
a = 456;
a = 123456789123456789;

标识符

-在JS中所有的可以由我们自主命名的都可以称为是标识符
- 例如：变量名、函数名、属性名都属于标识符
- 命名一个标识符时需要遵守如下的规则：
1.标识符中可以含有字母、数字、_、$
2.标识符不能以数字开头
3.标识符不能是ES中的关键字或保留字
4.标识符一般都采用驼峰命名法
- 首字母小写，每个单词的开头字母大写，其余字母小写
helloWorld xxxYyyZzz
- JS底层保存标识符时实际上是采用的Unicode编码，所以理论上讲，所有的utf-8中含有的内容都可以作为标识符

数据类型

数据类型指的就是字面量的类型

其中String Number Boolean Null Undefined属于基本数据类型
而Object属于引用数据类型

String字符串

-在JS中字符串需要使用引号引起来
- 使用双引号或单引号都可以，但是不要混着用
- 引号不能嵌套，双引号不能放双引号，单引号不能放单引号

    var str = 'hello';

Number

在JS中所有的数值都是Number类型，包括整数和浮点数（小数）

    a = Number.MAX_VALUE * Number.MAX_VALUE;
    a = Infinity;
    a = "abc" * "bcd";
    a = NaN;
    console.log(typeof a);//number

Boolean 布尔值

使用typeof检查一个布尔值时，会返回boolean

Null（空值）类型

值只有一个，就是null

null这个值专门用来表示一个为空的对象
使用typeof检查一个null值时，会返回object

    var a = null;
    console.log(a);
    console.log(typeof a);object

Undefined（未定义）类型

值只有一个，就undefind
当声明一个变量，但是并不给变量赋值时，它的值就是undefined
使用typeof检查一个undefined时也会返回undefined

    var b;
    b = undefined;
    console.log(b);
    console.log(typeof b);//undefined

强制类型转换

方式二：
- 调用String()函数，并将被转换的数据作为参数传递给函数
- 使用String()函数做强制类型转换时，
对于Number和Boolean实际上就是调用的toString()方法
但是对于null和undefined，就不会调用toString()方法
它会将 null 直接转换为 "null"
将 undefined 直接转换为 "undefined"

        //调用String()函数，来将a转换为字符串
    a = String(a);

    a = null;
    a = String(a);
    
    a = undefined;
    a = String(a);

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

将其他的数据类型转换为Number

调用parseInt()函数将a转换为Number
parseInt()可以将一个字符串中的有效的整数内容去出来，然后转换为Number

    a = parseInt(a);//123

parseFloat()作用和parseInt()类似，不同的是它可以获得有效的小数

    a = "123.456.789px";
    a = parseFloat(a);//123.456

如果对非String使用parseInt()或parseFloat()，它会先将其转换为String然后在操作

    a = true;
    a = parseInt(a);
    console.log(typeof a);//number
    console.log(a);//NaN

其他进制的数字

在js中，如果需要表示16进制的数字，则需要以0x开头
如果需要表示8进制的数字，则需要以0开头
如果要要表示2进制的数字，则需要以0b开头，但是不是所有的浏览器都支持

    十六进制
    a = 0x10;
    a = 0xff;
    a = 0xCafe;
    
    八进制数字
    a = 070;
    
    二进制数字
    a = 0b10;

像"070"这种字符串，有些浏览器会当成8进制解析，有些会当成10进制解析

    a = "070";
    a = parseInt(a);
    console.log(typeof a);
    console.log(a);

可以在parseInt()中传递一个第二个参数，来指定数字的进制

    a = "070";
    a = parseInt(a,10);
    console.log(typeof a);//number
    console.log(a);//70

将其他的数据类型转换为Boolean

使用Boolean()函数
- 数字 ---> 布尔
- 除了0和NaN，其余的都是true
- 字符串 ---> 布尔
- 除了空串，其余的都是true
- null和undefined都会转换为false
- 对象也会转换为true

运算符也叫操作符

通过运算符可以对一个或多个值进行运算,并获取运算结果
比如：

例·

    var a = 123;
    result = a + 1;//124
    result = true + 1;//2
    result = true + false;//1
    result = 2 + null;//2
    result = 2 + NaN;//NaN
    result = "123" + "456";//'123456'
    result = "你好" + "小帅哥";//'你好小帅哥'

我们可以利用这一特点，来将一个任意的数据类型转换为String
我们只需要为任意的数据类型 + 一个 "" 即可将其转换为String
这是一种隐式的类型转换，由浏览器自动完成，实际上它也是调用String()函数

        c = null;
    c = c + "";

    console.log(typeof c);//string
    console.log(c);//null

练习

    result = 1 + 2 + "3";//33
    result = "1" + 2 + 3; //123

    result = 100 - 5;//95
    result = 100 - true;//99
    result = 100 - "1";//99

    result = 2 * 2;//4
    result = 2 * "8";//16
    result = 2 * undefined;//NaN
    result = 2 * null;//0

    result = 4 / 2;//2
    result = 3 / 2;//1.5

一元运算符，只需要一个操作数

+ 正号，正号不会对数字产生任何影响
- 负号,- 负号可以对数字进行符号的取反

    var a = 123;
    a = +a;
    a = -a;

对于非Number类型的值，它会将先转换为Number，然后再运算
可以对一个其他的数据类型使用+,来将其转换为number，它的原理和Number()函数一样

    a = true;
    a = -a;//-1 number
    a = "18";
    a = +a;//18 number

自增和自减

逻辑运算符

JS中为我们提供了三种逻辑运算符

赋值运算符

关系运算符

通过关系运算符可以比较两个值之间的大小关系，
如果关系成立它会返回true，如果关系不成立则返回false
> 大于号
- 判断符号左侧的值是否大于右侧的值
- 如果关系成立，返回true，如果关系不成立则返回false
>= 大于等于
- 判断符号左侧的值是否大于或等于右侧的值
< 小于号
<= 小于等于

Unicode编码

相等运算符

上一篇下一篇

猜你喜欢

热点阅读