JavaScript-01基础

最新推荐文章于 2024-07-30 22:36:34 发布
最新推荐文章于 2024-07-30 22:36:34 发布
阅读量120 收藏
点赞数
文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiaoai_tx/article/details/106881879
版权 
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
   <script>
       /*
           alert()：控制浏览器弹出警告框
           document.write()：在计算机页面中body输出内容
           console.log():向控制台输出内容
       */
       alert("警告框，biubiu");
       document.write("测试实验");
       console.log("控制台输出");
   </script>
</head>
<body>
   <!--
       代码可以放在onclick标签中，也可以放在在超链接的href中，还可以放在外部js文件
   -->
   <button onclick="alert('放置在onclick标签的代码');">标签</button>

   <a href="javascript:aletr('js代码写在超链接的href中');">点击一下</a>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            多行注释    单行注释 //       

            1. js严格区分大小写
            2. js语句以分号结尾
            3. js忽略多个空格和分号
        */
    </script>
</head>
<body>
    
</body>
</html>

字面量和变量

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            字面量：不可变值
            变量：可以任意改变的值

            声明变量：使用var来声明
                注：语法   var a = 10;

            标识符：由自己定义的符号称为标识符
                例：变量名，函数名，属性名
                1. 标识符可以含有数字，字母,"_"等
                2. 不能以数字开头
                3. 不能和关键字冲突
                4. 采用驼峰命名
        */
    </script>
</head>
<body>
    
</body>
</html>

数据类型

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            基本数据类型:
                String  字符串
                Number  数值        js浮点计算不准确
                Boolean 布尔值       ture  false
                null    空值
                undefined 未定义
            引用数据类型：  object  对象

            typeof 变量     检查数据类型
            infinite 无穷
            NaN      特殊数字，not a num   

            当声明变量却不赋值时，则是undefined
        */

        /*
            转换str数据类型：1. 变量.toString();
                             2. 调用String函数 

            转换num数据类型： 1. 调用Number函数
                              2. 调用parseInt       将字符串的有效整数提出
                                 调用parseFloat     将字符串的整数，小数提出

            转换Boolean数据类型： 1. 调用Boolean函数
        */

        var str = "nothing";
        var a = 666-555;
        a = a.toString();          // 将a转换成为字符串类型

        var b = 2*5;
        b = String(b)

        console.log(typeof b)

        /*
            js中，以0x或0开头后跟进制数字，如0x10；0xff；035(注：八进制)            
        */
    </script>
</head>
<body>
    
</body>
</html>

逻辑运算符

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var a = 1 && 2;
        var b = 2 && 1;

        var c = 5 || 6;

        console.log(a);
        console.log(b);
        console.log(c);
    </script>
</head>
<body>
    <!--
        js中的逻辑运算符： || 或 ； && 与； ! 非
        当对非布尔值运算时，先转换成布尔值，再计算：
            如：对任意数据取反两次，则会转换成为布尔值

        对于非布尔的与计算，若两个值都是true，则返回后者,第一个值是false，则返回第一个值
        对于非布尔的或计算，两第一个值是true，则返回前者，第一个值为false，则返回第二个值

        对于非数字的关系运算符比较，若是字符串，则是比较其Unicode编号大小，且是一位一位轮流比较
        
        在字符串中使用转义字符输入Unicode编码。 例：\u转义字符码
        在网页中使用。 例：&#转义字符码;

        js中，有 ==(相等)；!=(不等)；===(全等) ； !==(非全等)
        区别：全等和非全等不会转换字符串类型判断，

    -->
</body>
</html>

三元运算

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            条件表达式?语句1:语句2；
                条件表达式成立，则执行语句1，否则执行语句2
        */
    </script>
</head>
<body>
    
</body>
</html>

流程控制

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            语句：1. 条件判断语句 2. 条件分支语句 3. 循环语句
            if语句：语法1
                if(条件表达式){
                    语句...
                }else{
                    语句...
                }

            语法2：
                if(条件表达式){
                    语句1...
                }else if(){
                    语句2...
                }else if()...{
                	语句...
                }；

            条件分支语句：
                switch语句：语法
                    switch(条件表达式){
                        case 表达式:
                            语句...
                            break;
                        case 表达式:
                            语句...
                            break;
                        default:
                            语句...
                            break;
                    }；

            循环语句：
                while语句： 语法          // 先判断条件表达式，再执行循环体
                    while(条件表达式){
                        语句...
                    };

                do...while语句：  语法    // 先执行循环体，再判断条件表达式
                    do{
                        语句...
                    }while(条件表达式)；


                for语句： 语法
                    for(①初始表达式; ②条件表达式;④   更新表达式){
                        ③语句...
                    }

        */
    </script>
</head>
<body>
    
</body>
</html>

break和continue

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            brake关键字一般不用在for循环
            可为循环语句设置一个label：标识当前循环，并且使用break：label终止

            continue关键字可用跳过当前循环，
            console.time("计时器名字") 用来开启计时功能    
            console.timeEnd("计时器名字") 计算时间
            js中用math.sqrt() 引入平方根，和Python中相比有点麻烦
        */
    </script>
</head>
<body>
     
</body>
</html>

对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            js中利用new Obeject来构建对象  
            向对象中添加属性值：语法 对象.属性名 = 属性值
                注：可使用[变量名]创建部分异常的属性名
            利用 "属性名" in  判断属性名是否存在

                var a = 10;
                a++
                var b = a;
                console.log(a);
                console.log(b);

            js中变量保存在栈中，基本数据类型直接在栈中存储，且相互独立，
            -----
            对于对象
                对象是保存在堆内存中，创建对象即在堆内存创建空间，变量保存的是对象的内存地址,即变量可以通过指针引用数据

        */

        var info = new Object();
        info.name = "小明";
        info.age = 18; 

        console.log(info);



        /*
            利用对象字面量创建对象
                语法：{属性名：属性值,...}
        */

        var obj = {name:"李四",
                   age:18,
                   id:001};
    </script>
</head>
<body>
    
</body>
</html>

函数

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            函数：封装功能
                语法：var c = new Function()
                调用函数： c(); 
        */

        /*
            函数声明创建函数：
                语法：
                    function 函数名([形参1，形参2，...]){
                        语句...
                    }
        */

	     function test(){
	         console.log("测试");
	         alert("真的比Python麻烦");
	     }

        test();

        function test1(a, b){
            var d = a + b;
            return d;
        }

        var result = test1(10,30);
        console.log("result = "+ result);

        /*
            立即执行函数：往往只执行一次
            例： (function(a,b){
                    alert("匿名函数");
                }(12,10));
        */

	        (function(a,b){
	            alert("匿名函数");
	        }(12,10));

    </script>
</head>
<body>
    
</body>
</html>

全局作用域

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
            全局作用域中的全局对象是window
            局部作用域可以访问全局作用域，反之不行，若要在函数中访问全局作用域，可以使用window.变量名
            使用var关键字声明的变量，会使得声明提前
        */
    </script>
</head>
<body>
    
</body>
</html>
xiaoai_tx
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript-0基础入门
weixin_46726946的博客
05-07 1504
1 计算机编程基础 1.1 编程语言 1.1.1 编程 编程：就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码，并最终得到结果的过程。 计算机程序：就是计算机所执行的一系列的指令集合，而程序全部都是用我们所掌握的语言来编写的，所以人们要控制计算机一定要通过计算机语言向计算机发出命令。 注意：上面所定义的计算机指的是任何能够执行代码的设备，可能是智能手机、ATM机、黑莓PI、服务器等等。 1.1.2 计算机语言 计算机语言指用于人与计算机之间通讯的语言，它是人与计算机之间传.
01-JavaScript-基础1
08-03
JavaScript 是一种广泛用于客户端Web开发的脚本语言，由Netscape公司开发，它是一种基于对象和事件驱动的编程语言。JavaScript的出现极大地...学习和掌握JavaScript的基础知识，对于任何Web开发者来说都是至关重要的。
黑马程序员---JavaScript基础---01
一夜奈何梁山
08-10 930
一：JavaScript的三种引入方式： 1：行内式：主要用于事件。 格式：onclick =“js代码” <input type="button" name="" onclick="alert('ok！');"> 2:内嵌式：使用script标签 <script type="text/javascript"> alert('ok！'); </script> 3：外链式：使用script标签的src属性指定目录。 <script
javascript百炼成仙 第一章 掌握JavaScript基础01 初入宗门
热门推荐
java小白翻身
10-06 17万+
乐阳村，处于脚本大陆东部的边缘地带，民风淳朴，村名日出而作，日落而息。这一日清晨，所有村民来到村庄的门口，正在为一个十五六岁的少年送别。只见那少年虽然身体瘦弱，可是目中绽放出异彩，身躯虽不壮实，倒也挺拔。 “叶小凡，你是我们全村人的骄傲，百年来唯一一个具备修行JavaScript甲等资质的孩子！马上会有千鹤派的大人来接你，今后你一定要认真修行，给我们全村的人争光！” 他叫叶小凡，几天前通过了修行资质的检验，符合修行JavaScript的资质。 “千鹤派！”叶小凡眼前一亮，语气中伴随着激动，两眼放光。千鹤派，
JavaScript-时区
MountGao的博客
08-13 3276
JavaScript-时区 简介 时区是地球上的区域使用同一个时间定义。以前，人们通过观察太阳的位置（时角）决定时间，这就使得不同经度的地方的时间有所不同（地方时）。1863年，首次使用时区的概念。时区通过设立一个区域的标准时间部分地解决了这个问题。 世界各国位于地球不同位置上，因此不同国家，特别是东西跨度大的国家日出、日落时间必定有所偏差。这些偏差就是所谓的时差。 历史 在农业社会，世界各地一般采用各自的地方时。十九世纪随着长途铁路运输的发展，1870年代加拿大铁路工程师弗莱明首次提出全世界按统一标准
JavaScript学习--Day01
Cure The World的博客
09-04 1167
JavaScript是什么，能干什么？ 一个网页的结构，是通过HTML决定的 CSS决定了这个网页的样式 这个网页的行为是通过JavaScript决定的 JavaScript发展史 它最初由Netscape的Brendan Eich设计。JavaScript是甲骨文公司的注册商标。Ecma国际以JavaScript为基础制定了ECMAScript标准。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript实现包含三个部分：ECMAScript，文档对象模型，浏览器对象模型。 N
01-JavaScript基础-开篇介绍
JiangNanMax的博客
08-31 3730
01-JavaScript基础-开篇介绍 编程语言 编程语言是人和计算机交流的工具，工程师通过编程语言基于计算机去开发一款款软件 编程语言就是一门语言，只不过语法比较特殊，我们得学习之后才能使用这门语言来开发相应的东西 编程语言大致可以分为以下几类：机器语言、汇编语言、高级语言 机器语言 000000101 000000010 000000000 汇编语言 MOV ...
JavaScript 逆向 ( 一 ) --- JavaScript 语法基础、逆向技巧
freeking101的博客
05-11 6907
JavaScript 语法基础、逆向技巧
TS-01 基础数据类型
dadongsj的博客
07-27 1万+
官方文档：TS 是一种由微软开发的自由和开源的编程语言。他是JS的一个超集，本质上向这个语言添加了可选的静态类型和基于类的面对对象编程。
01-初识JavaScript
计算机小白学前端~
04-28 908
记录js学习过程中的笔记
JavaScript基础 - 生成随机数
zihong2019的博客
04-30 2877
生成0到1的随机数，不限制小数位数 // 0~1 Math.random() // 0.17861332453350798 Math.random() // 0.8202207891174798 Math.random() // 0.38043470547599245 Math.random() // 0.15911621979893908 生成0或1的随机数 // 0/1 Math.round(Math.random()) // 0 Math.round(Math.random()) // 1 Math
01-JavaScript基础.md
02-08
01-JavaScript基础.md
challenge-javascript-01:Challenge-javascript-01-三角形的面积
03-08
Challenge-javascript-01-三角形的面积用基本的，有趣的和有趣的方式描述基础知识。安装npm install测试npm run test回购完整的三角计算法。完整的消息认为应保留“叉子”，不能使用左轮手枪，请提出保留要求。贡献...
JavaScript-01.zip
03-15
这个名为"JavaScript-01.zip"的压缩包显然包含了关于JavaScript基础学习的材料，特别是针对01知识点的讲解。从描述来看，我们可以期待一系列以HTML格式编写的教程文档，这些文档可能是教学笔记或者实例演示，可以...
VUE3自定义指令防止重复点击多次提交
MadSnail00的博客
07-30 57
vue3连续点击按钮重复提交，vue3自定义指令防止重复提交
【分享】前端程序员-技术网站推荐
一位前行者的博客
07-30 346
对于前端开发人员来说，以下是一些推荐的技术网站，这些网站提供了丰富的资源和知识，可以帮助你提升前端开发技能：收集一些 、、 的网站 vite 官方中文文档 element-plus 官方中文文档 pinia 官方中文文档 vue-router 官方中文文档 Tailwind CSS 官方文档 vitest 官方中文文档 es6 中文文档 axios 官方中文文档 vxetable 官方中文文档 lodash 中文文档 echarts 官方中文文档 animat
【Vue3】自定义组件
最新发布
又言又语
07-30 227
本文介绍 Vue3 中如何自定义组件。页面组件：用于构建独立页面，通常存放在src/pages或src/views目录下。功能组件：将页面中一些独立的功能封装成独立组件，譬如：分页组件、日期时间组件等。功能组件通常存放在目录下。本文主要说明如何自定义功能组件。
我们的前端开发逆天了！1 小时搞定了新网站，还跟我说 “不要钱”
努力做最接地气的编程干货分享，感谢关注
07-29 893
本文将带你了解一个新的 Web 框架 **Astro**，并手把手带你使用 Astro 搭建一个属于自己的站点，用过的都说真香！
vue el-select的下拉树形结构 带检索功能
Jokerxiuka的博客
07-26 212
【代码】vue el-select的下拉树形结构。
"JavaScript基础教程-课件01：语言特点、运行环境和基本语法
JavaScript课件-01.pptx是一份适用于学生和教师的JavaScript基础教程，旨在帮助学习者了解JavaScript的基本概念、语法和特点。课件的主要内容包括关于JavaScript的定义、JavaScript与Java的区别、JavaScript程序的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值