5-JavaScript

1、什么是JavaScript

　简称JS，是一门嵌入在网页中执行的脚本语言，专门用于实现网页交互。

　JS嵌入在网页中，由浏览器负责解析并执行。为网页添加各种各样的动态效果或者为表单添加校验，目的是为了提供更好的用户体验。

　JS和其他语言一样，有自身的数据类型、表达式、运算符、语句等程序基本组成部分。

　JS目前已经被广泛的应用于Web开发。

2、JS特点和优势

　2.1、特点：（1）JS是一门直译式语言，直接执行的就是源代码。是一边解释一遍执行，没有编译的过程（不像Java需要提前编译为class文件再运行）；

　　　　（2）JS是一门弱类型的语言。

　　　　　　Java声明变量：String s1 = "hello java!!!";

　　　　　　JS声明变量：var s1 = "hello js!!!";

　2.2、优势：（1）良好的交互性；

　　　　（2）一定的安全性（JS被强制的要求，不能访问浏览器以为的任何东西，只能访问浏览器和浏览器内部的资源，例如硬盘）

　　　　（3）跨平台性（Java语言具有跨平台性，因为具有虚拟机，但虚拟机不跨平台），JS能跨平台是因为有浏览器，只要有浏览器的地方都能执行JS，但浏览器不跨平台。

3、在HTML书写JS的方式

　　（1）在script标签内部可以书写JS代码：

1 <head>
2     <script type="text/javascript">
3         alert("引入JS的第一种方式");//JS内置函数，弹框效果，警告框
4     </script>
5 </head>

　　（2）通过script标签引入外部的JS文件：

　　demo.js文件

/* 引入JS的第二种方式 */
alert("引入JS的第二种方式");

　　demo.html文件

<head>    
    <script type="text/javascript" src="8-demo.js">
        alert("888");//此处代码不会执行
    </script>
</head>

　注：引入JS文件的script标签最好不要自闭，如果自闭了可能会导致浏览器引入JS文件失败；

<script type="text/javascript" src="8-demo.js" />

　　　引入JS文件的script标签内部不要再写JS代码，即使写了也不会执行；

　　　script标签通常会放在head和body内部（放在其他地方也可以执行）。

　　（3）在元素上通过事件绑定，也可以将JS代码直接写在元素上，代码示例：

<body>
    <input type="button" value="别点我！"  onclick="alert('不让你点你非要点')"> <!-- onclick=函数 -->
</body>

4、JavaScript语法

　4.1、注释：// 、/* */

　4.2、数据类型：

　　基本数据类型：

　　　　（1）数值（number）：JS中的数值在底层都是浮点型，但在需要时会自动的和整形之间进行转换，例如：2.4+3.6结果是6，而不是6.0。Infinity（正无穷大）、-Infinity（负无穷大）、NaN（非数值）。

　　　　（2）字符串（string）：JS中字符串属于基本数据类型，并且JS中的字符串类型可以使用单引号或多引号引起来，例如：var str1 = "hello JS"、var str2 = 'hello JS'。JS的字符串类型在底层有对应的包装对象 --String，

1 var str3 = "hello JS"; //typeof str3  --string
2 
3 var str4 = new String("hello JS"); //typeof str3  --Object
4 str3.valueOf(); //当需要时，会将字符串转成对应的包装对象，从而调用属性或方法。
5 str4.valueOf();

　　　　（3）布尔（boolean）:布尔类型常用于条件检测中，值为true和false。

　　　　（4）undefined：undefined类型的值只有一个，就是undefined。当声明了变量，但没有为变量赋值时，该变量的值就是undefined。

　　　　（5）null：null类型的值也只有一个，就是null，表示空值，可以用于函数的返回值，表示函数返回的是一个空的对象。

　　复杂数据类型：主要指的是对象（JS的内置对象、JS自定义对象、数组、函数）

　4.3、声明变量

　（1）在JS中通过var关键词声明变量，例如：

1 var a = 10;
2 var b = true;
3 var c = "hello JS";

　（2）在JS中声明的变量不区分类型，可以指向任意类型的数据，例如：var x = 10; x = "abc"; x = false;在一段代码中，可以给一个变量赋不同类型的值。

　4.4、JS运算符：

　　算术运算符：+、-、*、/、%、++、--

　　赋值运算符：=、+=、-=、*=、/=、%=

　　比较运算符：==、！=、>、>=、<、<=

　　位运算符：&、|

　　逻辑运算符：&&、||

　　前置逻辑运算符：！(not)

　　三元运算符：表达式？表达式1：表达式2

　4.5、JS语句

　　JS中语句和Java中的大致相同

　　（1）if分支结构：if分支结构用于基于不同的条件来执行不同的动作。语法结构如下：

1 　　if(条件1){
2 　　　　当条件1为true时执行的代码
3 　　　　}else if(条件2){
4 　　　　当条件2为true时执行的代码
5 　　　　}else{
6 　　　　当条件1和条件2都不为true时执行的代码
7 　　　　}

    <!-- 弹框提示用户输入成绩，并返回用户输入的内容 -->
    <script type="text/javascript">
        var score = prompt("请输入您的成绩：")
        console.log=(score);//浏览器的控制台
        if(score >= 80 && score <= 100){
            alert("您的成绩属于：优秀！");
        }else if(score >= 60 && score < 80){
            alert("您的成绩属于：中等！");
        }else if(score >= 0 && score < 60){
            alert("您的成绩属于：不及格！");
        }else{
            alert("您输入的成绩不合法：请重新输入！");
        }
    </script>

（2）switch语句：使用switch语句来选择要执行的多个代码块之一。语法结构如下：

 1 switch(n){
 2 　　case 1:
 3 　　　　执行代码块1
 4 　　　　break;
 5 　　case 2:
 6 　　　　执行代码块2
 7 　　　　break;
 8 　　default:
 9 　　　　与case1 和case2不同时执行的代码
10 　　}

　　执行原理：首先设置表达式n（通常是一个变量）。随后表达式的值会与结构中的每一个case的值作比较。如果存在匹配，则与该case关联的代码块会被执行。请使用break来阻止代码自动地向下一个case运行。

　　（3）for循环语句：循环代码块一定的次数，语法结构如下：

1 for(语句1; 语句2; 语句3){
2 　　被执行的代码块
3 }

　　（4）while循环：在指定条件为真时循环执行代码块，分为while和do/while循环。语法结构如下

1 //while
2 for(条件){
3 　　被执行的代码块
4 }

--------------------------我是结束线----------------------------------

posted @ 2022-05-21 11:43 小吴的日常阅读(49) 评论(0) 收藏举报

刷新页面返回顶部

wupiao

5-JavaScript

1、什么是JavaScript

2、JS特点和优势

3、在HTML书写JS的方式

4、JavaScript语法

公告