JavaScript基础

最新推荐文章于 2021-11-16 11:35:37 发布

我是你要找的bug

最新推荐文章于 2021-11-16 11:35:37 发布

阅读量285

点赞数

分类专栏： JavaScript 文章标签： JavaScript

本文链接：https://blog.youkuaiyun.com/XUYIGE/article/details/103292630

版权

JavaScript 专栏收录该内容

21 篇文章

订阅专栏

JavaScript(JS)是一种解释性的、事件驱动的、面向对象的、安全的和与平台无关的脚本语言，是动态HTML（也称为DHTML)技术的重要组成部分，广泛用于动态网页的开发。

JavaScript的实例

JavaScript脚本程序是嵌入或者外部引入在页面中的，通过一个<script>标记说明，浏览器能够解释并运行包含在标记内的代码。
基本语法：

<script type="text/javascript"[src="外部 js 文件"】>
...
</script>

语法说明：
1、script为脚本标记，它必须以<script type="text/javascript">开头,以</script>结束，用于界定程序开始的位置和结束的位置。在一个页面内可以放置任意数量的<script>标记。
2、script页面中的位置决定了什么时候装载它们，如果希望在其他所有内容之前装载脚本，则要确保脚本在head部分。
3、src属性不是必要的，它指定了一个要加载的外部JS代码文件，一旦应用了这个属性，则<script>标签中的任何内容都将被忽略。
4、引入的前后顺序取决于是否需要网页加载完成和按需加载，看元素是否初始化完成。
1.一个直接运行的JavaScript程序
假设要在页面中输入一段“欢迎进入Javascript学习之旅”这段文本。
代码片段如下：

1.<！--程序 10-1-->
2.<html>
3.<head><title></title></head>
4.<body>
5.   <script type="text/javascript">
6.      document.write("欢迎进入Javascript学习之旅!");
7.   </script>
8.</body>
9.</html>

在10-1的程序中，5~7行的代码之前没有出现过，具体的代码在第六行，document. write字段是标准的JavaScript命令，用来向页面写入输出，这行代码被包括在用<script>开始的标签内。也就是说，如果需要把一段JavaScript代码插入到HTML页面中，需要使用<script>标签（同时使用type属性来定义脚本语言）。
这样，<script type="text/javascript">和</script>就可以告诉浏览器javascript程序是从何处开始，到何处结束。如果没有这个标签，浏览器就会把document. write(“欢迎进入Javascript学习之旅!”)当成是纯文本来处理。也就是说会把这条命令本身写道页面上。
2、通过事件触发被调用的Javascript程序
程序10-2是另外一种类型的程序，它会在页面加载后弹出一个对话框：

1.<！--程序 10-1-->
2.<html>
3.<head><title></title>
4.   <script type="text/javascript">
5.   function show(){
6.     alert("欢迎进入javascript学习之旅！");
7. }
8.   </script>
9.</head>
10.<body οnlοad="show()">
11.</body>
12.</html>

除了JavaScript代码依然被包含在<script>标签内，这个程序和10-1不同的是：这段代码是一个函数，被命名为show，虽然他的功能是弹出一个对话框，但函数本身并不会自动执行，他的执行依赖于<body onload="show()">标签中关于body标记的onload属性的设置，”οnlοad="show()"意味着告诉浏览器在加载这个页面后要调用执行一个名为“show”的函数。

JavaScript的放置

1、位于head部分的脚本
如果把脚本放置到head部分，在页面载入的时候同时载入了代码，在<body>区调用时就不需要载入代码了。通常，这个区域的JavaScript代码是为body区域程序代码所调用的事件处理函数或一些全局变量的声明。
2、位于body部分的脚本
放置于body中的脚本通常是一些在页面载入时需要同时执行的脚本，这些代码执行后的输出成为页面的内容，在浏览器中可以即时看到。
一般的JavaScript代码放在<head></head>之间和<body></body>之间从执行结果来看是没有区别的，但有如下规则：
（1）当JavaScript要在页面加载过程中动态建立一些web页面的内容时，应将JavaScript放在body中合适。
（2）定义为函数并用于页面事件的JavaScript代码应放在head标记中，因为他会在body之前加载。
3、直接位于事件处理部分的代码中
例如：

<html>
<title></title>
<body οnlοad='alert(“欢迎进入javascript学习之旅！”)；'>
</body>
</html>

4、位于网页之外的单独脚本文件
如果页面中包含大量的JavaScript代码，将不方便页面的维护，或者同样的代码可能在很多页面中都需要，为了达到共享的目的，就可以把一些JavaScript代码放到一个单独的文本文件中，然后以”.js"为扩展名保存这个文件，当页面中需要这个js文件中的JavaScript代码时，通过指定script标签的src属性就可以使用外部的JavaScript文件中包含的代码。
在使用这种方式加载外部文件形式的JavaScript代码时需要注意以下几点：
（1）外部的JavaScript程序文件中并不需要使用<script>标签，此文件的内容仅含有JavaScript程序代码。
（2）使用src属性后，在该script元素内部的任何内容都将被忽略。如果需要嵌入其他的代码，可以继续在文件中添加一对新的</script>标签。
（3）当src属性指定外部文件所在的位置时，默认是在页面所在的目录下。

变量

变量分为值类型和引用类型，变量的关键字是“var” 命名用驼峰命名法。
在js中是严格区分大小写的
变量的数据类型：
number（数字类型）、string（字符串类型）、Boolean（布尔型）array（数组）、null（空）、undefined（未定义类型）、object（对象类型）
声明变量：可以一次声明一个变量，也可以一次声明多个变量。在使用变量之前先初始化（赋值）。

var a； 
var b，c；
var  m=10；
var j=10，k=“ab”；

变量的提前声明（声明提前）：

console.log（n）；
var n=10；

检测变量的数据类型：使用typeof

var a=10;
var b="a";
var c=null;
var d=true;
var e=undefined;
var f={};
var g=function(){
}

console.log(typeof a); //number
console.log(typeof b); //string
console.log(typeof c); //object
console.log(typeof d); //boolean
console.log(typeof e); //undefined
console.log(typeof f); //object
console.log(typeof g); //function

array （数组）object（对象） function（函数）是引用类型，其他的都是值类型。
根据作用域分为全局变量和局部变量。

JS函数

函数关键字：function
1、常规定义方式：(常规函数也会声明提前）
function 函数名称(){}
声明函数：
function method(){
}
函数的执行：函数名称();
method();
常规函数的提前声明：

method();
function method(){
}

带返回值的函数 return

console.log(method());
function method(){
          return"您好"; //返回的数据类型不定
}

带参函数：实参形参

console.log(method(1,2,3));
function method(a,b,c){
      return a+b+c;
  }

method(1,2,3);
function method(){
     console.log(arguments[0]);
     console.log(arguments[1]);
     console.log(arguments[2]);
     console.log(arguments. length);
}

2、匿名函数（不带名称的函数）

var method=function(){
}
method();

3、自执行函数（匿名自动执行)

(function(1,2,3){
      console.log(a,b,c);
})();