JS基础一(持续更新)

JS

    • 什么是JS?
      • JS简介
      • JS和html,css对比
      • js能做什么
    • JS写法及语法
      • JS写法
      • JS语法
    • 变量
    • JS中的数据类型
      • number数据类型
      • string数据类型
      • boolean数据类型
      • undefined数据类型
      • 数据类型转化
    • JS代码执行的过程
      • 代码段
      • 代码执行
    • JS中的函数
    • JS中数据的存储

什么是JS?

JS简介

JS:javascript 简称为JS 是一门编程语言

JS和html,css对比

相同:html,css,js代码都可以在浏览器中运行,html,css,js它们的运行环境是浏览器
不同点:html,css 不叫编程语言 js是编程语言 js的运行环境不只浏览器,还可以在其它的环境中支行。
作为一个前端开发工程师 JS是核心
使用JS输出Hello World~~

console.log("hello world");

js能做什么

  1. 开发网站
  2. 开发app
  3. 小程序
  4. 游戏开发 小程序游戏 网页游戏
  5. 写后端 node.js
  6. 嵌入式
  7. 区块链

JS写法及语法

JS写法

  1. 把js写在html文件中通常就写在script标签中(内部写法)
  <script>
    var a = 110;
    console.log(a)
   </script>
  1. 把JS写在JS文件中,然后在html文件中通过script标签引入 写项目时通常会把JS写在一个单独的文件中(外部写法)
  <script>
    <script src="./out.js"></script>
   </script>
  1. 把JS代码写在开始标签中,当成开始标签的属性(行内写法)
 <button onclick="console.log(888)">点我</button>

JS语法

  1. JS是区分大小写的 var a = 1; var A = 2;
  2. 忽略空白符(空格 换行 tab)
  3. 语句分号可加可不加
  4. 注释 单行注释 多行注释 注释是给程看的
  5. 标识符 和 关键字 var a = 110; var:关字 a:变量名标识符
  6. 注释:// 单行注释 /* 多行注释 */

变量

  1. 数据:一个软件打开后,界面上有很多的数据,也叫状态,这个状态可以保存在两个地方,一个是内存,一个是硬盘
  2. 变量:变量就是内存中的一个空间。
    变量名:内存空间的别名 对变量名的操作就是对内存空间的操作
    变量值:存储在内存空间中的状态(数据)
  3. 在JS中,如何定义变量:
    var a = 110; // 定义了一个变量 变量的名是a 变量的值是110;
  4. 变量的分类:
    1)全局变量:在函数内部和外部都能访问到
    2)局部变量:只能在函数内部访问到
    分界点是:函数
    只要把变量写在函数里面就是局部变量,只要写在函数外面就是全局变量。
  // 声明一个变量
    var a = 110;
    // 声明一个函数
    function f() {
        //在函数里面访问全局变量
        console.log(a);//返回值是110
        var b = 666;  // 局部变量

        console.log(b);   //返回值是666 函数内部是可以访问到局部变量
    }
    // 调用函数
    f()  // 一个函数没有调用相当于这个函数没有写
    // 在函数外面访问全局变量
    console.log(a);//返回值是110
    console.log(b); //  b is not defined  函数外面是访问不了函数里面的变量

JS中的数据类型

为了更加合理使用内存空间,基本上所有的编程语言中都提出数据类型的概念,研究针对不同的数据,分配不同的空间。
基本数据类型

  1. number 数字 var a = 110; int a = 110;
  2. string 字符串 ”“ ‘’ JS中不分字符和字符串 都叫字符串
  3. boolean true false 布尔类型
  4. undefiend 没有值
  5. null 没有值

引用数据类型

  1. object 对象
  2. array 数组
  3. function 函数 在JS中函数也是一种数据类型

number数据类型

  1. number是一个数据类型,这个数据类型对应的值有无数个。
  2. 在JS中number数据类型是不分整数和小数 都number
  3. 可以通过typeof查看一个变量值的数据类型
  4. 最大值 和 最小值
  5. number可以通过不同进制显示 进制 10进制 进制 16进制 8进制
  6. NaN Not a Number 不是一个数字
  7. JS中不要对小数运算 要运算先转成整数 得到的结果往往不对

在JS中,说到数据类型,主要指变量值的数据类型。
typeof是运算符 + - * / 都是运算符
Number叫类,也叫构造器,也叫函数

 var a = 110; // 110是一个数据  这个数据的类型是number
    var b = 3.14; // 3.14也一个number数据
    console.log(a);
    console.log(typeof a)//判断数据类型
    console.log(Number.MAX_VALUE)//最大值
    console.log(Number.MIN_VALUE)//最小值

string数据类型

  1. 在JS中 使用‘’ “”把字符串包起来 不包 JS会给它当成变量
  2. 单引号不要嵌套单引号 双引号不要嵌套双引号 外单内双 外双内单
  3. string数据类型对应的数据有无数个
  4. SyntaxError表示语法错误
    var a = "hello 'abc' js"
    console.log(a);//返回 hello 'abc' js

boolean数据类型

  1. boolean数据类型对应的值就两个 true false
  2. true 和 True 不一样的 JS是区分大小写的
    var b = true;
    console.log(b);
    console.log(typeof b);

undefined数据类型

  1. undefiend是一个数据类型,这种数据类型对应的值是undefiend
  2. 当一个变量没有赋值或它的值是undefiend或这个值的类型是undefiend的时候会出现undeined
    var a;
    console.log(a);  // undefined 值
    console.log(typeof a);  // undefined 是类型

数据类型转化

  1. 数据类型转化:
    隐式类型转化:静悄悄地,不知不觉地就进行了类型转化
    强制类型转化:写代码进行转化
  2. 在JS中,下面的值转成false,其它值都转成true:
    0 -0
    “”
    undefined
    null
    NaN

前提:在JS中,运算符两侧需要保存数据类型一致,如果不一致,JS解释器会帮你把一个数据类型转成另一个数据类型。

     // 隐式类型转化
    // + 叫运算符  123操作数   "abc"也叫操作数
    // 一个运算符如果有两个操作数,这个运算符叫二元运算符,也叫二目运算符,还叫双目运算符
    // +  -  =
    // 如果一个运算符只有一个操作数,这个运算符叫一元,单目运算符
    // +是双元运算符   运算符你要保证两侧操作数的数据类型要一致
    var res = 123 + "abc";  // 123隐式转化成字符串
    console.log(res);  // 123abc
    console.log(typeof res);  // string

    // 强制类型转化
   console.log(parseInt(3.14)); // 把小数转成整数
    console.log(parseInt("3.14abc")); // 尝试把小数或非数字转成整数
    console.log(parseFloat(3))
    console.log(parseFloat("3.14abc"))
    console.log(Number("abc123"))  // NaN
    console.log(Number("123abc"))  // NaN
    console.log(Number("123"))  // 123
    console.log(String(123456))  // 123456

JS代码执行的过程

代码段

  1. 一个script标签就是一个代码段。
  2. JS代码在执行时,是一个代码段一个代码段执行。
//
//

代码执行

  1. 定义变量和声明变量:
    定义变量:var a = 110; 定义 = 声明+赋值
    声明变量:var a = 110; 说的声明仅仅是说var a 后面是赋值
  2. 预编译: 提升到了代码段最前面
    把加var的变量进行提升 变量声明会提升 变量的赋值不会提升
    把使用function声明的函数进行提升 提升的是整个函数声明
  3. 代码的执行:
    一行一行执行
  4. 代码分两类:
    全局代码 函数外面的代码叫全局代码
    函数代码 一个函数就是一个局部代码
// 1)在全局代码中,加var会提升,没有var的不会提升。
    console.log(a);
    a = 110;  // a is not defined

    // 2)不管加没加var的全局变量,都会作为window的属性
    var a = 1;
    b = 2;
    console.log(window.a)// 1
    console.log(window.b)// 2

    // 3)没有加var的变量,只能作为全局变量,只要是全局变量,肯定是window的属性
    function f() {
        a = 666;
    }
    f()
    console.log(window.a)  // 666

    // 4)加var的局部变量,不会作为window的属性
    function f() {
        var a = 666;
    }
    f()
    console.log(a)  //666
    // 访问一个对象上不存在的属性,结果就是und
    console.log(window.a) // undefined

JS中的函数

  1. 函数是任何编程语言都有概念
  2. 在JS中定义函数有两种形式
    函数定义
    函数表达式
// 函数定义  f叫函数名  ()是函数特有的标识  {} 叫函数体
    // 定义 = 声明 + 赋值
    function f() {
        console.log("hello")
        console.log("js")
        console.log("vue")
    }
    // 函数调用
    f(); // 调用函数时,就会把函数体中的代码都执行了

    // 函数的返回值
    function f() {
        return 666;
    }
    // // 函数的返回值是返回到了函数调用处
    var a = f(); // 函数调用
    console.log(a);
    console.log(f()); // f()得到的就是函数的返回值

    // 一个函数如果没有返回值,默认返回undefiend
    function f(){
    }
    console.log(f()); // undefined

    // undefined出现的地方?
    // 答:一个变量没有赋值  值就是und    一个函数没有返回值,也是返回und

    // 给函数传递数据
    function f(a,b) {  // a b叫形式参数  形参
        // 形参就是函数内部的局部变量
        return a+b;
    }
    // 1 2叫实际参数  实参
    var r = f(1,2); // 函数调用的过程就是实参向形参赋值的过程
    console.log(r);

JS中数据的存储

  1. 内存分堆内存和栈内存
  2. 在JS中,基本数据类型存储在栈中 引用数据类型存储在堆中

你可能感兴趣的:(学习笔记,大前端)