JavaScript基础

最新推荐文章于 2022-05-24 15:54:03 发布

腾阿腾

最新推荐文章于 2022-05-24 15:54:03 发布

阅读量203

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_45138033/article/details/99761854

版权

前端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

JavaScript简介

JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

JavaScript组成及作用

JavaScript 实现是由以下 3 个不同部分组成的：

核心（ECMAScript）
文档对象模型（DOM）
浏览器对象模型（BOM）

JavaScript的作用：

JavaScript 能够对页面中的所有 HTML 元素进行增删改
JavaScript 能够对页面中的所有 HTML 元素的属性进行设定和修改
JavaScript 能够对页面中的所有 CSS 样式进行设定和修改
JavaScript 能够对页面中的所有事件作出反应

如何在HTML页面中使用JavaScript

在网页中加入< Script > < / Script > 标记JavaScript的开始和结束，将JavaScript代码放到
< Script >< / Script >之间
引入外部的JavaScript文件，文件扩展名为 .js，这种方式为开发首选

Javascript基础语法

变量

JS作为一种弱类型语言，定义变量只有一种格式：

var 变量名=值;

ES6 新增定义常量的规范：

const 常量名=值；

数据类型

JavaScript只具有几个原始的数据类型：

Number 数字类型（整数，小数）
String 字符串类型（字符，字符串）
Object 引用类型（对象）
undefined 未定义类型
NaN 保留字（表明数据类型不是数字）

使用运算符typeof可以得到变量的原始数据类型：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
        var num = 100;
        var num2 = 3.14;
        var str = "abc";
        var obj = new Object();
        var flag = true;
        document.write(typeof num+"</br>");
        document.write(typeof num2+"</br>");
        document.write(typeof str+"</br>");
        document.write(typeof obj+"</br>");
        document.write(typeof flag+"</br>");
    </script>
</head>

<body>

</body>

</html>

在这里插入图片描述

运算符

数学运算符

数学运算符:：+ , - , * , / , % , ++ , --
+：相加
-：相减
*：相乘
/：相除
%：百分之
++：自增
--：自减
比较运算符：== , === , >= , <= , < , > , != , instanceof
==：比较是否相等（会发生自动类型转换）
===：先比较数据类型，数据类型一致再比较值
>：比较是否大于
<：比较是否小于
>=：比较是否大于且等于
<=：比较是否大于且等于
!=：比较是否不等于
instanceof：比较是否为同一数据类型

自动类型转换

当这个运算符运算的值,和他期望的值不一样,就会发生自动类型转换。

字符串类型转数字类型：

var a="a2";
var b="2";
var c=3
document.write(a*c);
document.write("</br>");
document.write(b*c);

在这里插入图片描述
字符串参与运算时，字面值允许的情况下会自动转为数字型，字面值无法转换时会转为NaN（不是数字的数字）。

布尔类型转数字类型：

ar flag1=true;
var flag2=false;
document.write(flag1+1-1);
document.write("</br>");
document.write(flag2+1-1);

在这里插入图片描述
布尔类型参与运算时转为数字类型，true 转为 1 ，false转为 0。

字符串转布尔类型：

var str="";
        if (str) {
            document.write("字符串转为了true")
        }else {
            document.write("字符串转为了false")

在这里插入图片描述

var str="aaa";
        if (str) {
            document.write("字符串转为了true")
        }else {
            document.write("字符串转为了false")

在这里插入图片描述

字符串转为布尔类型: 空串转为 false 非空串转为 true。

数字类型转布尔类型：

for (var i = -2; i <= 2; i++) {
            if (i) {
                document.write("i=" + i + "时转为true</br>")
            } else {
                document.write("i=" + i + "时转为false</br>")
            }
        }

在这里插入图片描述
数字类型转为布尔类型: 0转为 false 非 0转为 true。

Object类型转为布尔类型：

对象非null转为 true，对象为 null转为 false。

undefined转为布尔类型：

var v;
        if (v) alert("undefined转成了true")
        else alert("undefined转成了false")

在这里插入图片描述
undefined转布尔类型，转为 false。

NaN转为布尔类型：

var v = NaN;
        if (v) alert("NaN转成了true")
        else alert("NaN转成了false")

在这里插入图片描述
NaN转布尔类型，转为 false。

函数

函数：对一段功能逻辑的封装，以实现重复调用。

定义函数的语法：

function 函数名(参数){逻辑体}
var 函数名=function(参数){逻辑体}

调用函数的语法：

函数名(参数);

函数的参数和返回值：

函数的形式参数，不需要写数据类型。
JS中调用函数时,可以不传参,可以少传,也可以多传。
函数内部有arguments属性是一个数组,可以把所有传递过来的参数,放到这个数组中。

<script>
    function show(){
        for(var i=0;i<arguments.length;i++){
            document.write(arguments[i]+"</br>");
        }
    }
    show(10,20,30,40,50,60);
    
    </script>