JavaScript学习记录01快速入门、基本语法、严格检查模式-CSDN博客

本文链接：https://blog.csdn.net/asdfghjkl_zth/article/details/122824174

文章目录

- JavaScript学习记录01快速入门、基本语法、严格检查模式

JavaScript学习记录01快速入门、基本语法、严格检查模式

1.1什么是JavaScript

JavaScript是一门世界上最流行的脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行。

1.2认识JavaScript框架

jQuery：是一种库，封装了成千上万已经写好的方法，可以直接拿来用。优点是简化了DOM操作，缺点是DOM操作太频繁，影响前端性能；在前端眼里使用它仅仅是为了兼容IE6、7、8；
Angular:：Google收购的前端框架，由一群Java程序员开发，其特点是将后台的 MVC模式搬到了前端并增加了模块化开发的理念，与微软合作，采用TypeScript语法开发；对后台程序员友好，对前端程序员不太友好；最大的缺点是版本迭代不合理(如: 1代->2代，除了名字，基本就是两个东西)
React:：Facebook 出品，一款高性能的JS 前端框架；特点是提出了新概念【虚拟DOM】用于减少真实DOM操作，在内存中模拟DOM操作，有效的提升了前端渲染效率；缺点是使用复杂，因为需要额外学习一门【SX】语言；
Vue ：一款渐进式JavaScript框架，所谓渐进式就是逐步实现新特性的意思，如实现模块化开发、路由、状态管理等新特性。其特点是综合了Angular(模块化)和React (虚拟 DOM)的优点；
Axios ︰前端通信框架；因为 vue的边界很明确，就是为了处理DOM，所以并不具备通信能力，此时就需要额外使用一个通信框架与服务器交互；当然也可以直接选择使用jQuery 提供的AJAX通信功能。

1.3快速入门

第一个JavaScript程序：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--  在script标签内写JavaScript代码  -->
    <script>
        alert('hello world');
    </script>
</head>
<body>

</body>
</html>

在这里插入图片描述
同CSS一样，JavaScript工程也应尽量规范：

引入：<script src="js/qj.js"></script>
注意，script标签必须成对出现，引入代码若写成：<script src="js/qj.js"/>则有可能出现错误。

1.4基本语法入门

JavaScript中没有变量类型的说法：

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        //1.定义变量
        var num = 1;
        var name = "JavaScript";
    </script>
</head>

另，通过浏览器调试JavaScript：
在这里插入图片描述

其中：console.log(num)：在浏览器的控制台打印变量，相当于Java中的System.out.println()

浏览器必备调试方法：
在这里插入图片描述

1.5数据类型简介

js中有六种数据类型，包括五种基本数据类型（Number,String,Boolean,Undefined,Null），和一种复杂数据类型（Object）。

1、Number

JavaScript不区分小数和整数
Number类型包含整数和浮点数（浮点数数值必须包含一个小数点，且小数点后面至少有一位数字）两种值。
NaN：非数字类型。特点：① 涉及到的任何关于NaN的操作，都会返回NaN ② NaN不等于自身。
isNaN() 函数用于检查其参数是否是非数字值。
isNaN(123) //false isNaN(“hello”) //true
Infinity：表示无限大

2.String类型

字符串有length属性。
字符串转换：转型函数String()，适用于任何数据类型（null,undefined 转换后为null和undefined）；toString()方法（null,defined没有toString()方法）。

3.Boolean类型
该类型只有两个值，true和false

4.Undefined类型
只有一个值，即undefined值。使用var声明了变量，但未给变量初始化值，那么这个变量的值就是undefined。

5.Null类型
null类型被看做空对象指针，null类型也是空的对象引用。

6.Object类型
js中对象是一组属性与方法的集合。这里就要说到引用类型了，引用类型是一种数据结构，用于将数据和功能组织在一起。引用类型有时候也被称为对象定义，因为它们描述的是一类对象所具有的属性和方法。

特别提醒
1、比较运算符：

=赋值符号
==等于（类型不一样，值一样，也会判断为true）
===绝对等于（类型一样，值一样，才会判断为true）
这是JS的一个缺陷，坚持不要使用==比较

2、 Java的数组必须是相同类型的对象，JS中不需要这样

7.对象
对象是大括号，数组是中括号：
每个属性用“，”隔开，最后一个不需要添加

<script>
    var person={
        name:"zhangsan",
        age:3,
        tags:['js','java','web']
    }
</script>

在这里插入图片描述

1.6严格检查模式

前提：IDEA设置为ECMAScript 6语法。
必须写在第一行

'use strict'

预防JS随意性导致的一些问题
比如：直接 i=1;这样定义成了全局变量，有时会出问题。
写代码时，写在<script>和</script>中的第一行。
局部变量，建议不用i = 1;去定义，而采用let i =1;定义。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript学习</title>
    <script>
       'use strict';
       i = 1;  //全局变量
       let i = 1;               //这样写是局部变量
       let name = "zhangsan";    //这样写是局部变量 
       alert(i);
       alert(name);
    </script>
</head>
<body>
</body>
</html>