设为首页 加入收藏

TOP

Javascript - 基础语法(一)
2019-09-17 19:09:24 】 浏览:47
Tags:Javascript 基础 语法

java script 是一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言。有很广的应用范围。

PC 浏览器、PC 软件、手机浏览器、手机 app、微信小程序、微信公众号开发、硬件开发、服务器开发、AR、VR、深度学习、机器学习

1 在 html 中使用 java script

在 html 中 script 标签内容的执行,是按顺序执行,但是加载是按照异步进行加载。script 标签里面如果有代码出错,仅仅只会影响到这个script标签代码的执行。

同步:一个事情完成之后,才能做下一件事情,有等待就是同步。
异步:一个事情发起之后,下一个事情也可以立即发起,不需要等待前面一个事情完成之后才发起。

script 标签

<script type="text/java script">
    console.log("未成年人禁止进入1")
    console.log(a)
</script>

引用 java script 文件

<script src="js/index.js" type="text/java script" charset="utf-8"></script>

运行原理

浏览器首先会解析 html,解析到 script 标签时候,会调用 java script 引擎执行 script 标签里的代码。执行前会对代码预编译(一些语法纠正和变量提升处理),然后解释执行。

java script 是按照代码块来进行编译和执行的,代码块间相互独立,但变量和方法共享。例如:

<script type="text/java script">
      alert(str);//因为没有定义str,所以浏览器会出错,下面的不能运行
      alert("我是代码块一");//没有运行到这里
      var test = "我是代码块一变量";
</script>
<script type="text/java script">
      alert("我是代码块二"); //这里有运行到
      alert(test); //弹出"我是代码块一变量"
</script>

但是这种共享只能发生在后面的 script 调用前面的 script 的成员,因为 script 是按 html 中的顺序预处理、执行的,所以下列代码会报 undefined 错误:

<script type="text/java script">
      Fn();  //浏览器报错:"undefined"
</script>
<script type="text/java script">
      function Fn(){ //函数1
          alert("执行了函数1");
      }
</script>

执行顺序总结

  1. 读入第一个代码
  2. 做语法分析,有错则报语法错误(比如括号不匹配等),并跳转到step5。
  3. 对var变量和function定义做“预编译处理”(永远不会报错的,因为只解析正确的声明)。
  4. 执行代码段,有错则报错(比如变量未定义)。
  5. 如果还有下一个代码段,则读入下一个代码段,重复step2。
  6. 结束。

2 变量

java script 是弱类型语言,所以声明变量的时候,统一用 var 进行声明变量。如果赋值前没有申明,就会自动声明一个全局变量。声明后未赋值的变量会被设置为 undefined。

注意:js 在预编译的时候,变量的声明会被提升到最上面。

  • 全局变量:在最外层声明的变量,以及在函数内部未用 var 声明变量,是全局变量,所有的全局变量都可以在控制中调用 window 查看
  • 局部变量:在函数内部声明的变量就是局部变量

java script 变量类型:

  • 数值类型:整数、浮点数、infinite、-infinite、nan
  • 字符串类型:"abc" ,'123'
  • 对象:{},new object()
  • 布尔值:true和false
  • undefined:有声明但是未赋值。
  • null:这是赋值了就是空的内容。

3 运算

java script 支持算术运算、逻辑运算、关系运算、条件运算(三目运算符),用法上和 Java 类似,这里只提几个特殊的点。

3.1 除法

由于 java script 是弱类型,并没有对变量类型有定义,所以在做除法()并不像 Java 一样是求余,而是准确结果(可以为小数)。

3.2 浮点数的运算

和 Java 类似,浮点数的运算有精度问题,例如 0.1 + 0.2 答案是不正确的。

3.3 === 及 !==

=== 和 !== 表示全等于和全不等于,它和 ==、!= 的区别在于:在 java script 中,== 和 != 会对变量自动进行类型转换,产生一些奇怪的结果,而 === 和 !== 会对比较拥有更严格的限制,要求两边类型和值都相等在返回 true(不做类型转换)。

<script type="text/java script">
    var a = 3;
    var c = "3"
console.log(a==c)
var d = 0;
    var e = false;
    var f = null;
    var g = undefined;
console.log(d==e)
    console.log(e==f)
    console.log(f==g)
    console.log(d==f)
    console.log(true==1)
    console.log(0=="")
    console.log(false=="")
    console.log(null=="")
    console.log(undefined=="")
    console.log(a!==c)
</script>

输出结果:

结果

易混淆的比较,以下结果为 true:
3 == "3"
0 == false; 1 == true
null == undefined
0 == ""; false == ""

4 流程控制

java script 的流程控制和 Java 类似,常用的有分支语句 if-else,switch-case,循环语句 while,for。

/*用 for 循环输出乘法口诀表*/
<script type="text/java script">
    for(let i = 1; i < 10; i++){
        let str = ""
        for(let j = 1; j <= i; j++){
            str +=  j + "*" + i + "=" + i*j + "\t";
        }
        console.log(str);
    }
</script>

口诀表

5 函数

5.1 函数的定义

java script 中定义一个函数有两种方式。

方法1:

function count(a){ return x }
方法

首页 上一页 1 2 下一页 尾页 1/2/2
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇javascript获取当前用户访问的宽.. 下一篇原生js实现继承

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目