JavaScript的入门

gyutdcu

已于 2023-08-02 19:19:54 修改

阅读量63

点赞数

文章标签： javascript 开发语言 ecmascript

于 2023-08-02 18:27:51 首次发布

本文链接：https://blog.csdn.net/gyutdcu/article/details/132064396

版权

一、什么是JavaScript

JavaScript是一种操作网页的脚本语法，语言标准是ECMAScript，简称ES。JavaScript与Java的关系，就像雷锋和雷峰塔，是没有关系的。

二、JavaScript的引入方式

JavaScript的引入方式与CSS的引入方式是类似的，有以下三种方法：

1、行内引入

直接在标签中嵌入JavaScript代码，示例中发生点击事件时，有弹窗提示。

<div onclick="JavaSricpt:alert('行内引入的方式')">点击</div>

行内引入有一个常用的应用场景是在链接标签的href属性中写“JavaScript：void（0）”，表示点击后不进行跳转或刷新。

<a href="JavaScript:void(0)">点击</a>

注：行内引入方式不推荐使用，因为CSS的代码也可写在行内，会耦合在一起，也不利于后续代码的维护和管理。

2、嵌入式引入

嵌入式引入就是将JavaScript代码写在<script></script>标签中，标签可以放在body标签中，也可以放在head标签中。

<script>
    JavaScript代码
</script>

3、外部引入

外部引入就是像CSS那样，单独写一个后缀名为“.js”的文件，在html文件中通过script标签引入，具体就是在script的src属性中添加js文件的路径。标签放在head标签中。

    <script src="./index.js"></script>

注：这种方式是在后续项目开放中常用的一种，有利于代码的维护和管理。

三、JavaScript的变量

变量是用来存放数据的，当我们在声明变量的时候肯定是有规范的，这就需要一个标准。

1、JavaScript变量由数字、大小写字母、下划线和“$”符号组成，但不能由数字开头。

2、不能是保留字或关键字，比如this、for、goto等等。

3、可以是中文，也就是能识别unicode编码的字符。

四、声明变量

声明变量的语法为 “var 变量名 = 值”。变量的相关操作有两个：存值和取值。

如果在给一个变量赋值时，发现这个变量不存在，就会隐式声明这个变量，之后再赋值。

<script>
     ac = '你好';
     console.log(ac);
</script>

变量在进行取值时，会取最后一次存的值，变量不存在则会报错。示例代码中，第一次打印结果是“helloworld”，而第二次则会报错，显示d为未定义。

 <script>
      var a = 4;
      a = 'hello';
      var b = a + 'world';
      console.log(b);
      var b = 12 + d;
      console.log(b);
 </script>

除了var，还可以用let和const，let和const均是在ECMAScript 6（ES6）中引入的。

三者间的区别在于：

作用域：var是在函数作用域，声明为全局变量时则全局生效，let和const都是作用在块级作用域。

重复声明：var声明的变量可以重复声明，取最后一次存的值，而let和const则不能。

变量声明提升：var声明的变量可以先使用再声明，而let和const则不能，必须先声明再使用。

const定义的变量实质上是常量，当你改变这个值时会报错，提示不能给常量变量赋值。

五、JavaScript的数据类型

数据类型总体分为两类：基本数据类型和引用数据类型。

基本数据类型：数字（number）、字符串（string）、布尔（boolean）、undefined、null。

引用数据类型：数组、对象（object）、函数（function）。

1、number

小数参与运算时，可能会发生精度丢失的情况，这是有两种方式解决。用“tofixed（）”方法，括号中是保留几位小数，遵循四舍五入。用parseInt方法，直接进行向下取整。

<script>
     var a = 0.4;
     var b = 0.3;
     var c = a + b;
     var d = c.toFixed(0);//四舍五入
     var e = parseInt(c);//向下取整
     console.log(c,d,e);
</script>

2、string

用单引号或双引号引起来的叫做字符串。有模板字符串、JSON字符串、queryString，其中模板字符串是使用反引号（`）引起来的。

字符串运算时的“+”表示拼接，也就是说当加号两端中有一个是字符串，则会进行拼接操作，结果值是字符串类型。

3、boolean

只有两种取值情况：true和false。在实际开发中，很少会直接声明变量是true还是false，而是对一个变量判断是真是假，然后依据布尔值执行不同的操作。对变量进行布尔类型判断时，空字符串、0、undefined、null、false为假，其他都为真。

<script>
    var a = 'hello';
    if(a){
       console.log('布尔类型是真');
    }
</script>

注：所谓的空字符串是值引号内没有内容，敲了一个空格后，就表示有内容了，是true。

4、undefined和null

当声明一个变量却没有赋值时，类型就是undefined。声明变量时赋值为null，则是null类型。两者的区别为null类型是存在一个空间的，只是里面没有内容，而undefined类型则是不存在空间。

六、typeof运算符

用以判断一个数据的类型，返回的类型有number、string、boolean、undefined、object和function。语法是“typeof(变量)”或者“typeof 变量”。在上述undefined和null的区别中有一个区别就是：undefined的返回类型是undefined，而null的返回类型是object。