首页 > 其他分享 >JS基础+变量+数据类型

JS基础+变量+数据类型

时间:2022-11-08 14:25:16浏览次数:46  
标签:10 console log 数据类型 JS let js 变量

  • js概述====≥使用方式
  • js是什么=====》js是运行在浏览器/客户端上的一种编程语言,实现人机交互。
  • js能做什么===》 现在几乎是全能=〉数据交互,表单校验,app的开发,游戏开发,网页特效,服务端编程(node.js)
  • js的组成ECMAScript DOM BOM
  1. ECMAScript(规范语言的基本语法 if for let)
  2. DOM:一套操作网页的元素的方法  比如对页面元素进行移动、大小、添加删除等操作
  3. BOM:一套操作浏览器功能的方法 比如检测页面弹窗、检测窗口宽度 、存储数据到浏览器等
  • js书写的位置:
  1. </body>结束标签的上面 =>将 <script> 放在HTML文件的底部附近的原因是浏览器会按照代码在文件中的顺序加载 HTML

    如果先加载的 JavaScript 期望修改其下方的 HTML,那么它可能由于 HTML 尚未被加载而失效。

    因此,将 JavaScript 代码放在 HTML页面的底部附近通常是最好的策略。

  2.  <body style="color: red">
        <!-- 内部js -->
        <script>
          // 页面弹出警示框
          alert("你好。。。");
          document.write("qqqq");
        </script>
      </body>
    <body>
        <!-- 行内 -->
        <button onclick="alert('我是点击后弹出的内容')">哈哈哈</button>

    ==================================================================
    <!-- 已经引入外部js后 就不要哦在<script>就不要哦在这里写内容了 因为浏览器会自动忽略 不生效</script> --> <!-- <script src="./demo.js">外部引入</script> --> <script> alert("努力"); // alert("努力");括号里面要有双引号/单引号 // document.write("加油⛽️"); document.write("加油⛽️"); </script> <script src="./demo.js"></script> </body>

     

  3. 带有src属性的script标签内部的js代码浏览器会直接忽略
  • 快捷键注释 shift+alt+A =>多行注释 ctrl+?单行注释
  • js中的结束符要加都加 要不加则可都不加

   js输入语法 输出语法

 <script>
      // 1. 文档输出内容
      // document.write("页面文档输出");
      // console.log("控制台输出日志 程序员自己测试用的");
      // 输入语法
      // alert("警示框");
      // prompt("我是对话框 是输入语法 让用户输入用的");
      //  confirm:弹出一个框
      confirm("我帅不帅");
      alert("你好js");
      document.write('"Js我来了"');
      console.log("他会魔法吧");
      prompt("今年几岁了");
       document.write("<li>请求</li>"); //可以识别标签 可以换行        document.write(`        <li>请求</li>        <li>模版字符串可以换行</li>          `);
</script>
  • 变量:变量是存储数据的一个容器
    <script>
          // let if = 10
          // 交换变量
    
          let apple1 = "青苹果";
          let apple2 = "红苹果";
          // 用一个临时变量做一个备份 进行替换
          let temp = apple1;
          console.log(temp); //红苹果
          apple1 = apple2;
          console.log(apple1); //红苹果
          apple2 = temp;
          console.log(apple2); //青苹果
          /* 需求:
    有2个变量: num1 里面放的是 10, num2 里面放的是20
    最后变为 num1 里面放的是 20 , num2 里面放的是 10 */
          let num1 = 10;
          let num2 = 20;
          let temp1 = num1;
          console.log(temp1); //10
          num1 = num2;
          console.log(num1); //20
          num2 = temp1;
          console.log(num2); //10
          // 知识点拓展
          // 只声明不赋值 =》返回值为undefined
          let age;
          console.log(age);
          // 不声明不赋值 =》报错
          console.log(name);
          // 不声明直接赋值 不报错 =》及其不推荐
          sex = "nv";
          console.log(sex);
          // 注意:js是逐行解析 一步步执行 执行中有一步错 下面就不会再往下执行了
        </script>
  • let const var 的区别 
  1. var可以提升作用域  ======≥let和 const不可以提升作用域
  2. var可以重复声明 ========≥let和const不可以重复声明
  3. var可以先使用再声明 =====≥let 和const不可以先使用再声明====》不推荐
  4. let和const具有块级作用域 =====≥var不具有块级作用域
  5. const是常量必须给初始值且const的常量是不能被修改的========》var和let声明的是变量可以被修改
  • 数据类型 
    • 为什么分数据类型 =====≥1.为了充分的利用内存 2.为了程序员方便使用数据
  1. 基本数据类型又被称为值类型=====≥number boolean string null undefined
  2. NaN表示计算错误,它表示一个不正确或者未定义的数学操作所得到的一个结果

typeof用于检测数据类型 用于判断基本数据类型 null除外====》null typeof返回值是个对象(null是一个尚为创建的一个对象 用于将来里面会存放一个对象)

其余的基本类型typeof返回值是number  boolean  string  null  undefined

undefined和null区别:undefined表示只声明未赋值    null表示声明了但赋的值为空(因为将来里面会存放一个对象)

  1. 复杂数据类型又称为引用类型=====≥object Arr function
  • 隐式转换
    1. 数字类型number 的隐式转换 :+ - * / % (加减乘除余  字符串前面加正号)====》显示转换:Number paseInt   paseFolt
    2. 字符串类型string 的隐式转换 :+' ' =====≥显示转换String()包裹   变量名+toString()(字符串可以是单引号、双引号、单双引号嵌套、反撇号即模版字符串  注意:不能单引号嵌套单引号、双引号嵌套双引号)
      <script>
            // 隐士转换成数字 + - * 取余/
            console.log(10 - 9); //1
            console.log("10" - 9); //1 隐士转换成数字
            console.log("10" * "2"); //20
            console.log("10" / "2"); //5
            console.log("10" % "2"); //0
            console.log(+"10" + 2); //隐士转换 在前面+ +号转换成数字//12
            console.log("10" + 2); //这里属于字符串的拼接
            console.log(typeof +"20"); //number
            console.log("10" / "1");
            // + 写在数据前面为隐式转换number 否则为字符串拼接
            // 字符串隐式转换 String()包裹 /+‘’拼接单引号/变量名+toString()
            console.log(String(10)); //10   String()包裹
            console.log(10 + ""); //10   +‘’拼接单引号
            let age = 10;
            console.log(age.toString()); //10  /变量名+toString()
            console.log(typeof age.toString()); //string
          </script>

       

     

标签:10,console,log,数据类型,JS,let,js,变量
From: https://www.cnblogs.com/JAG2671169285/p/16863937.html

相关文章

  • P4048 [JSOI2010]冷冻波
    人生第一道紫题!debug巨久,码量巨大题目题目描述WJJ喜欢“魔兽争霸”这个游戏。在游戏中,巫妖是一种强大的英雄,它的技能FrozenNova每次可以杀死一个小精灵。我们认为,巫妖......
  • 【ES6 教程】第一章 新的ES6语法10—如何替换字符串中的变量
    英文|https://www.javascripttutorial.net翻译|杨小爱在今天的教程中,我们将学习JavaScript模板文字,它使我们可以更轻松地使用字符串模板。在ES6之前,我们使用单引号......
  • 【前端面试题】—53道常见NodeJS基础面试题(附答案)
    说到前端就不得不提到后端,我们给用户展示页面所需的数据正是从后端获取的,所以了解后端的运行原理和技术的实现很有必要。 Node.js是一个不错的选择,它是基于JavaScript语法......
  • 4种方法教你如何截取JS字符串最后一位
    方法一:运用String对象下的charAt方法charAt()方法可返回指定位置的字符。str.charAt(str.length–1)请注意,JavaScript 并没有一种有别于字符串类型的字符数据类型,所以返......
  • 12种JS常用获取时间的方式
    在编程中,总会遇到各种各样的获取时间的要求,下面我们来看一下获取不同时间格式的方法有哪些?如果不记得的话建议收藏哦!1、获取当前的日期和时间方法:newDate()​console.log(n......
  • process.env前端环境变量配置教程
    1、为什么要配置环境变量在公司,一个项目一般会有开发版本、测试版本、灰度版本和线上版本,每个版本会对应相同或不同的数据库、API地址。为了方便管理,我们通常做成配置文件的......
  • 6个在Vue.js编写更好v-for循环的技巧
    https://learnvue.co/2020/02翻译|杜尼卜在vuejs中,v-for循环是每个项目都会使用的东西,它允许您在模板代码中编写for循环。在最基本的用法中,它们的用法如下。<ul><liv-f......
  • vue 使用 js-file-download
    1、安装js-file-downloadnpminstalljs-file-download2、引入importfileDownloadfrom'js-file-download';3、使用download(){this.$api.fileDownload().......
  • JSONPath 处理特殊字符
    JSONPath处理特殊字符先来看看jsonpath的基础语法$表示文档的根元素@表示文档的当前元素.node_name或['node_name']匹配下级节点[index]检索数组中的元......
  • js简单时分秒计时器
    <divstyle="text-align:center"><inputtype="text"id="timetext"value="00时00分00秒"readonly><br><spanid="_h">00时</span><spanid="_m">00分<......