JavaScript语法基础

最新推荐文章于 2025-02-24 16:49:57 发布

转载最新推荐文章于 2025-02-24 16:49:57 发布 · 386 阅读

文章标签：

#JavaScrpt #DOM #语法

web html 专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何在HTML文档中引入JavaScript文件，并概述JavaScript的基本语法特性，包括数据类型、运算符、语句、函数及对象等内容。

<span style="font-family: Arial, Helvetica, sans-serif; font-size: 12px; background-color: rgb(255, 255, 255);">一，如何在Html文本中添加JavaScript文件：</span>

<span style="font-family: Arial, Helvetica, sans-serif; font-weight: normal; background-color: rgb(255, 255, 255);">（1）将Javascript代码放在head标签下的<script>    </script>标签中；</span>

（2）将Javascript代码另存为.js文件，在<head>部分加入以下代码：

<pre name="code" class="html">   <script src=“file.js" type="text/java script"></script>

（3）将2中的代码放置于HTML文档最后，</body>之前，如

<html lang="en">
<head>
  .....
</head>
<body>
   .......
   .......
   <script src=“file.js" type="text/java script"></script>
</body>
</html>

二，语法（与c语言不同之处）

1.数据类型：

js是一种弱类型语言，所有的数据类型均用 var来声明。

（1）字符串：

/*单双引号均可*/
var mood="happy"
var mood='happy'

var mood='i don/'t say'  //和c语言一样用/实现转义字符的表示

（2）数值：不规定整数还是浮点数，可任意赋值

var age=35
var age=33.25

（3）布尔值：true或false

（4）数组：

用Array（）或者[ ]来表示，( )括号里可以为数字或者是初始化元素，数字标示数组元素的个数。( ) [ ]括号里可以为空，表示不指定元素个数,[ ]里可以为初始化元素。

var beatles = Array(4);
var beatles = Array( );

var beatles = Array('John','Paul','George');

var beatles = [];

var beatles = ['John','Paul','George','Ringo'];

数组元素的使用和c语言相同:

beatles[0]='John';
beatles[1]='Paul';

二维数组和用法也类似c语言并且包含struct的用法：

var lennon=['John',1940,false];
var beatles=[];
beatles[0]=lennon;
//则 beatles[0][0]='John',beatles[0][1]=1940;

（5）对象--详见后面（以后再补充）

对象也是用一个名字表示一组值，对象的每一个值都是对象的一个属性。

对象用Object()或者{}表示，赋值和初始化和数组类似：用.操作符来获取对象属性，赋值时：属性名：值。

/*Object()*/
var lennon = Object();
lennon.name="John";
lennon.year="1940";
lennon.living=false;
/*{}*/
var lennon={name:'John',year:1940,living:false};

2.操作：

（1）算术运算符：+ - * / ++ -- 同c语言

注意:+ 运算符可以实现字符串的拼接：

var message="i am "+"happy";
var mood="happy";
var message="i am "+mood;
var year=2005;
var message="the year is "+2005;//数值和字符串拼接时可以自动转换为字符串。
var message="the year is ";
message+=2005;  //同理+=有两种含义，具体情况具体分析，此处为字符串拼接功能，message为 the year is 2005

（2）条件运算符：同c if(condition) statement; else....

（3）比较运算符：> < >= <= == != 同c

注意有两种新运算符：=== 表示严格相等 !==表示严格不相等---严格相等：类型和值必须都相等；例如：javascript 认为 false 和’ ‘空字符表示相同的含义，在==中返回的是true，但是===中返回false，因为其值含义相同，但是他们的类型不同；

（4）逻辑操作符：！&& || 同 c 语言；

3.语句-----同c

while(...){...}

do{...}while(..);

for(..;..;..){...}

if(...) {...}

else{.....}

4.函数：用function声明，即返回值默认为function；

function convertToCelsius(temp){
     var result=temp-32;
     result/=1.8;
     return result;
}


var tempF=95;
var tempC=convertToCelsius(tempF);
alert(tempC);    //弹窗显示结果为35；

5.对象：几个重要的概念：（关于对象以后再深入挖掘）

（1）属性：隶属于某个特定对象的变量；

方法：只有某个特定对象才能调用的函数；

均可以用点语法访问：

Object.prprerity;
Object.method();

（2）创建一个新的对象的实例：用new关键字：

var jeremy=new Person;
jeremy.mood='happy';
jeremy.age=30;

（3）内建对象：js自带的对象，比如：Date Math Array等；

（4）宿主对象：浏览器web提供的对象：Form ,Image,Element,Document;

注意：Document宿主对象可以用来捕捉页面上的任何一个元素的信息。