JavaScript语法知识笔记(一)——书写方式,输入出语句,变量,字面量,标识符,数据类型。

news2024/9/20 6:14:17

01.JS的三种书写方式

<!-- 2.内嵌式的js -->
    <script>
        // alert('sajmo');
    </script>

    <!-- 3.外部js script  双标签 -->

    <script src="script.js"></script>
   <!-- JS代码需要写到script标签中 -->

    <script type="text/javascript">
        /*
        *控制浏览器弹出一个警告框
         alert("这是我的一一行代码");
        */
       /*
       让计算机在页面中输出一个内容
       document.write("");可以向body中输出一个内容
       */
    //   document.write("看我出不出来");
        // 向控制台输出一个内容
        // console.log("你猜我在哪里出来");

        console.log("你猜我在哪里出来");
        alert("这是我的一一行代码");
        document.write("看我出不出来");

    </script>

02.输入出语句

    <script>
        /*
        alert(msg)  浏览器弹出警示框
        console.log(msg)  浏览器控制台答应输出信息
        prompt(info)浏览器弹出输入框用户可以输入 
        */
       //设置一个输入框
       prompt('q请输入你的年玲');
        //    alert  弹出警示框  输出的 展示给用户的
        alert('计算结果是');
        // console.log 控制台输出 给程序员看到
        console.log('我是程序员能看到的');

       
    </script>

03.变量

    <script>
        var myname = '旗木卡卡西';
        var address = '火影村';
        var age = 30;
        var email = 'kakxi@.cnm';
        var gz = 2000;
        console.log(myname);
        console.log(address);
        console.log(age);
        console.log(email);
        console.log(gz);

        //1.用户输入姓名  存储到 myname 的变量里面
        var myname = prompt('请输入您的名字');
        //2.输入这个用户名
        alert(myname);

        
    </script>

    <script>

        /*
        多行注释
        JS注释
        多行注释,注释中的内容不会被执行,但是可以在源码中查看
        */
       
    </script>

输出样式

        字面量 都是一些不可改变的值

            比如:1 2 3 4 5

            字面量可以直接使用 但是一般不直接使用.

        变量 变量可以用来保存字面量,而且变量的值是可以任意改变的

               变量更加方便我们的使用 所以在开发中都是通过变量

               去保存一个字面量 而很少直接使用字面量

               x=12313123123123143534

<script>

        //  声明变量
        // 在js中使用var 关键字来声明一个变量
        // var a;

        //为变量赋值
        // a=123

        // 声明和赋值同时进行
		

        // alert(12121312312312312);
		var b = 456789;
        console.log(a);

        var age = 80;
        console.log(age);

     </script>

04.标识符

标识符

            在JS中所有的可以由我们自主命名都可以成为标识符

            例如变量名 函数名 属性名都属于标识符

            命名一个标识符是需要遵守以下规则的

                1.标识符中可以含有字母 数字 下划线  $

                2.标识符不能以数字开头

                3.标识符不能是ES中的关键字和保留字

                4.标识符一般都采用驼峰命名法

                    -首字母小写 每个单词的开头字母大写,其余字母小写

                     helloWorld xxxYyyZzz

            JS底层保存标识符实际上采用的Unicode编码

                所以理论上讲,所有的utf-8中含有的内容都可以作为标识符

05.变量命名规范

 <script>
        var app = 10 ;
        var APP = 100;
        console.log(app);
        console.log(APP);
        //var 18 age ;错误书写
        // var var; 因为var有特殊意义,这个叫做关键字 不能作为变量名for while if
        // name 我们尽量不要直接使用name 作为变量名
        // console.log(tel);
        console.log(name);
    </script>

例题:交换两个变量的值

<script>
        var temp;//声明一个临时变量为空
        var apple1 = '青苹果';
        var apple2 = '红苹果';
        temp = apple1;
        apple1 = apple2;
        apple2 = temp;
        
        console.log(apple1);
        console.log(apple2);
    </script>

06.数据类型简介

 在js当中一共有六个数据类型

            String   字符串

            Number  数值

            Boolean 布尔值

            Null 空值

            UNderfined 未定义

            Object 对象
 

            其中string number null undefined 属于基本数值类类型

            而Object属于引用数据类型

            string 字符串

                在js中字符串需要使用引号引起来

                使用双引号或者单引号都可以,但是不要混着用

                引号不能嵌套,双不能放双,单不能放单

                    单引号中放双引号可以的

var num = 10; //num 属于数字型
        //js 的变量数据类型时是只有程序在运行过程中,根据等号右边的值来确定
        var str = 'pink';//str 字符串型 
        //js是动态语言 变量的数据是可以变化的

        var x = 10 ; //x是数字型
        x = 'pink' ; //x字符串型


        //数字型
        var num = 0; //num 数字型
        var  PI = 3.14//pi数字型
            //1.八进制0-7我们程序员里面加0 表示八进制
        var num1 = 010;

        console.log(num1);//
        
            //2.数字型的最大值
            console.log(Number.MAX_VALUE);
            //3.数字型的最小值
            console.log(Number.MIN_VALUE);
            //4.infinity 代表无穷大
            console.log(Number.MAX_VALUE * 2);
            //5.-infinity 代表无穷小
            console.log(-Number.MIN_VALUE * 2);
            //6.非数字
            console.log('pink老师' -100);  //NaN

   其中注意!

//isNaN()这个方法用来判断非数字  并且返回一个值 
        //如果是数字返回的是false 如果不是数字返回的是true

        console.log(isNaN(12));//false
 //字符串型 string
        // 语法为双引号 和单引号
            //嵌套的类型可以是 外双内单  外单内双
        var str = '我是一个"高富帅"的程序员';
        console.log(str);
        //字符串转义字符都是 \n  开头 但是这些转义字符得写到引号里面
        var str1 =  "我是一个'高富帅'的\n程序员";
        console.log(str1);
    //  \\表示斜杠\  \' 单引号  \t tab 缩进   \b 空格 \"双引号

07.字符串的拼接

    <script>
        //1.检测获取字符串的长度 length
        var str = 'my name is andy';
        console.log(str.length); //15

        //2.字符串的拼接 字符串+任何类型=拼接之后新的字符串 类型
        console.log('沙漠'+'骆驼');//字符串 沙漠骆驼
        console.log('燕子' + 18 +'岁'); 
        console.log('pink'+ true );
        console.log( 12 + 12 );//24
        console.log(' 12 ' + 12 );//1212

        //口诀 数值相加 字符相连
        str = "\\\\\\";

        //表示字面量字符串str
        alert("str");
        //输出变量str
        alert(str);

        var age = 18 ;

        //我们变量不要写到字符串里面 是通过和 字符串 相连的方式实现的
        console.log('pink老师' + age + '岁');

        //变量和字符串相连的口诀   引引加加
        console.log('pink老师岁');


            //案例讲解
            var age = prompt('请输入您的年龄');
            var str = '您今年已经' + age+ '岁了';
            alert(str);

        //布尔型

        var flag = true;  //flag 布尔型
        
        var flag1 = false;  //flag1 布尔型
        console.log(flag + 1);  // ture 参与加法运算当 1 来看
        console.log(flag1 + 1);  // false 参与加法运算当 0 来看
        //如果一个变量声明未附值 就是 undefined  未定义数据类型
        var str;
        console.log(str); //undefined
        var variable = undefined;
        console.log(variable + 'pink'); //undefinedpink

        console.log(variable + 1);//NaN undefined 和数字相加 最后的结果是NaN
        //null 空值
        //null 这个值专门用来表示一个为空的对象
        //使用typeof检查一个null值时,会返回objkect
        var space = null;
        console.log(space + 'pink' );//nullpink
        console.log(space + 1);//



        var str2 = "hello";

        str2 = "你好";

        str2 = 3;

        alert("hello,你好");

        console.log("我就是不出来");
        
        </script>

效果如下

 

 

 

 

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2056.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

软考高级-系统架构师-案例分析-架构设计真题考点汇总

2010年-2021年(不包括2019年和2020年)涉及到架构设计考点的有: 2010年题1,4; 2011年题1,4; 2012年题1; 2013年题1,4; 2014年题1,4; 2015年题1; 2016年题1; 2017年-题1; 2018年题1,5; 2021年题1 1.软件架构风格 软件架构风格是描述特定软件系统组织方式和惯用模式。组织方式描述…

2022第二届中国高校大数据竞赛A题(更新完毕)

文章目录题目任务做题解析第一问第三问第四问第一个预测第二个预测第五问关键技术摘要代码文件下载题目 制造业是国民经济的主体&#xff0c;近十年来&#xff0c;嫦娥探月、祝融探火、北斗组网&#xff0c;一大批重大标志性创新成果引领中国制造业不断攀上新高度。作为制造业…

公众号网课查题搭建-查题校园题库系统

公众号网课查题搭建-查题校园题库系统 本平台优点&#xff1a; 多题库查题、独立后台、响应速度快、全网平台可查、功能最全&#xff01; 1.想要给自己的公众号获得查题接口&#xff0c;只需要两步&#xff01; 2.题库&#xff1a; 查题校园题库&#xff1a;查题校园题库后台…

Vue项目中Pinia状态管理工具的使用

目录Pinia与Vuex的区别使用Pinia直接修改数据的两种方式使用actions修改数据重置state中数据Pinia持久化存储Pinia模块化实现Pinia中store之间互相调用Pinia官网介绍说&#xff1a;Pinia 是 Vue 的存储库&#xff0c;它允许您跨组件/页面共享状态。Vuex同样可以作为状态管理工具…

C++ Reference: Standard C++ Library reference: C Library: cstring: memset

C官网参考链接&#xff1a;https://cplusplus.com/reference/cstring/memset/ 函数 <cstring> memset void * memset ( void * ptr, int value, size_t num ); 填充内存块 将ptr指向的内存块的第一个num个字节设置为指定value&#xff08;解释为unsigned char&#xff0…

云原生之k8s--------Kubernetes原理

单机容器编排&#xff1a;docker-compose 容器集群编排&#xff1a;docker swarm&#xff0c;mesosmarathon&#xff0c;kubernetes 应用编排&#xff1a;ansible 一&#xff0c;Kubernets是什么&#xff1f; Kubernetes的缩写为&#xff1a;K8S&#xff0c;这个缩写是因为…

BFC以及清除浮动四种方式

什么是BFC 先了解常见的三种定位方案&#xff1a; bfc是普通流&#xff1a; 可以将bfc看作是一个属性 2.如何触发bfc 1&#xff0e;根元素() 2&#xff0e;浮动元素(元素的float不是none) 3.绝对定位元素(元素的position为absolute 或 fixed) 4.display为inline-block、tabl…

Xilinx HLS基础介绍(二)—— AXI4接口类型定义

本期主题&#xff1a; HLS的接口类型定义 往期链接&#xff1a; Xilinx HLS基础介绍&#xff08;一&#xff09;——HLS概念以及接口管理 目录1.Vitis HLS AXI4 接口概述2.顶层函数的实参类型与接口关系2.1 寄存器接口 S_AXILITE2.2 存储器接口 m_axi2.3 串流接口 axi4_stream…

学内核之十五:应用层如何实现原子访问

在Linux应用层开发中&#xff0c;使用的锁大多都是基于Posix提供的版本。其中&#xff0c;锁的实现&#xff0c;是基于futex调用来完成的&#xff0c;而futex建立在原子访问和内核系统调用上。通过查阅相关资料&#xff0c;发现futex不完全是内核层的实现&#xff0c;如果锁未被…

图像生成1

搬来好东西啊 ~~ 模型模型来源论文ProGANhttps://sota.jiqizhixin.com/project/0190e1fa-5643-4043-8b75-9b863a6d20db 支持框架&#xff1a;TensorFlowProgressive Growing of GANs for Improved Quality, Stability, and VariationStyleGANhttps://sota.jiqizhixin.com/proj…

c++ SFML 连接ftp

#include <string> #include <SFML/Network.hpp> using namespace std; void loginftp() { // TODO: 在此添加控件通知处理程序代码 sf::IpAddress address "127.0.0.1"; sf::Ftp server; sf::Ftp::Response connectResponse server…

CMake中include的使用

CMake中的include命令用于从文件或模块(file or module)加载并运行CMake code。其格式如下&#xff1a; include(<file|module> [OPTIONAL] [RESULT_VARIABLE <var>][NO_POLICY_SCOPE]) 从给定的文件加载并运行CMake code。变量读写访问调用者的范围(Variable rea…

React-Router之BrowserRouter 与 HashRouter切分方式和基本概念

查看本文 首先 你要对React-Router有一个基本了解 如果不清楚可以查看我的文章 初识react-router 做一个简单的路由切换 然后我们代码是这样 这里 我们有两个路由 对应两个组件 可以看到 我们的形式是 /路由代理名 但我们来看一个京东到家的界面 http://www.jddj.com/#/ …

传输层——UDP+TCP

文章目录传输层UDP协议UDP 概述UDP协议的报文UDP主要特点UDP使用注意事项基于UDP的应用层协议TCP协议TCP 概述TCP报文格式确认应答机制(最重要的机制)TCP协议的缓冲区问题16位窗口大小6个标记位①ACK②SYN③RST④PSH⑤URG⑥FIN三次握手四次挥手超时重传机制连接管理机制——状态…

【线性代数】P2 行列式的性质

本博客内容为&#xff1a;记录行列式的所有性质与推理 性质一&#xff1a;行列式的转置值不变 DDTDD^TDDT 性质二&#xff1a;行列式两行/列互换&#xff0c;值变号 D−D′D-DD−D′ 性质三&#xff1a;行列式中两行相等&#xff0c;值为0 D−D′−D,即2D0,D0D-D-D,即2D0,D0D−…

如何打开iso文件

iso文件用什么打开? iso文件用什么打开 ①使用光驱可以打开iso文件 iso文件是一种光盘(CD)上的系统文件格式&#xff0c;因此我们只需要将iso文件写入到光盘当中&#xff0c;然后用光驱打开光盘即可安装iso文件软件了&#xff0c;目前我们常购买的光盘系统盘就是商家将制作…

UNIAPP实战项目笔记30 购物车内容块布局

UNIAPP实战项目笔记30 购物车内容块布局 主要代码: 主要代码 shopcart.vue <template><view class"shop-view"><!-- 自定义导航栏 --><uniNavBartitle"购物车":rightText" isNavBar ? 完成 : 编辑"fixed"true&quo…

SSM学习42:SpringMVC入门案例(重点)

目录 创建SpringMVC项目 目录 补全目录结构 &#xff1a;添加java项结构 导入jar包 添加tomcat运行快捷键 创建配置类 SpringMvcConfig.class 创建Controller类 使用配置类ServletConfig替换web.xml 运行结果 因为SpringMVC是一个Web框架&#xff0c;将来是要替换Servl…

HTML5期末大作业【红色的电影售票平台网站】web前端 html+css+javascript网页设计实例 企业网站制作

HTML实例网页代码, 本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置&#xff0c;有div的样式格局&#xff0c;这个实例比较全面&#xff0c;有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。 文章目录一、网页介绍一…

死磕JAVA10余年,呕心整理出了核心知识点已经做成PDF,无私奉献

前言&#xff1a; 想在面试、工作中脱颖而出&#xff1f;想在最短的时间内快速掌握 Java 的核心基础知识点&#xff1f;想要成为一位优秀的 Java 工程师&#xff1f;本篇文章能助你一臂之力&#xff01; 目前正值招聘求职旺季&#xff0c;很多同学对一些新技术名词都能侃侃而…