(1)Javascript基础

zoukankan html css js c++ java

(1)Javascript基础
一.简介

基于对象和事件驱动的语言，应用于客户端。
- 基于对象：提供了很多对象，可以拿过来使用
- 事件驱动：html做网站静态效果，javascript做动态效果
- 客户端：指的是浏览器
特点
1. 交互性：信息的动态交互
2. 安全性：不能访问本地磁盘的文件
3. 跨平台性：能在各个平台上运行
与JAVA的区别
1. Java是sun公司开发，现在被Oracle公司收购；Javascript是网景公司
2. Java是面向对象；Javascript是基于对象
3. Java是强类型语言；Javascript是弱类型语言（类型不限定）
4. Java需要先编译成字节码文件，再执行；Javascript解析后就可以运行
Javascript组成
三部份
- ECMAscript：由以下组织定义的语法
- ECMA：欧洲计算机协会
- BOM：Browser Object Model 浏览器对象模型
- DOM：Document Object Model 文档对象模型
与html的结合方式
两种
- 用一个标签<script type="text/javascript"></script>
- 使用script标签引用外部js文件，在标签中加入src。使用这种方式不会执行内部写的代码，只会执行引入的代码。
```
 <script type="text/javascript" src="1.js">
   </script>
```
二.js的原始类型和声明变量

五种原始类型：定义类型都使用关键字var
- string：字符串
  
  var str="abc"; 这就是弱类型语言，不用考虑左边引用的类型。
- number：数字
  
  var m=123;
- boolean：布尔
  
  var b=true;
- null：获取当前对象的一个引用，null表示引用为空，所有对象的引用是Object
  
  var date=new Date(); 获取当前时间
- undefined：定义一个变量，没有赋值
  
  var aa;
那我们又有一个问题，如果赋值一样，那怎么判断数据类型呢？
所以，js提供了typeof(变量名称)来查看当前数据类型
```
 <script type="text/javascript">
   var date=new Date();
   var str="123"
   //alert(typeof(date));
   alert(typeof(str))
   </script>
```
Object
string

第一个答案说明了，所有对象的引用都是Object；第二个返回正确的类型

三.js中的条件判断语句
- if语句：与java中语法一样
- switch语句：js中没有java的数据类型限制，所有都支持；语法和java一样
- 循环语句
- while、do-while：与java一样，条件值不为零就无限循环
- for：除了定义语句为var，其他与java一样
i++与++i也是一样的

四.js中的运算符

js中大部分运算符与java中一样，下面我们看看一些不一样的例子。

1.数据类型差别
```
 <script type="text/javascript">
   var m=123;
   alert(typeof(m/1000*1000));
   </script>
```
上面问题的答案是多少呢？
在java中 123/1000*100答案为零，因为123为整型，除以1000后变为0，在乘以1000，还是0.
而在javascript里没有整型，浮点型限制，123/1000=0.123 0.123*1000=123,所以答案为123

2.字符串的相加减
- 数字加一
```
 <script type="text/javascript">
  var str="123";
  alert(str+1);
```
弹出1231，与java一样；
- 数字减一
```
 <script type="text/javascript">
  var str="123";
  alert(str-1);
```
弹出122，直接减了一；
- 字母加一：与数字的一样，在末尾加一
- 字母减一：弹出NaN，提示你这不是数字
- 字母与数字混用：也是与字母的加减混用
- 其他特殊符号：同上
>总结--------字符串的加减相加：做的是字符串的连接；相减：纯数字，数字的减法；有其他字符，提示NaN
3.boolean类型的加减
```
 <script type="text/javascript">
 /* (1)
  var str=false;
  alert(str+1);
  */
 /* (2)
  var str=true;
  alert(str+1);
  */
  /* (3)
  var str=false;
  alert(str-1);
  */
   /* (4)
  var str=true;
  alert(str-1);
  */
 </script>
```
答案
(1)：1
(2)：2
(3)：-1
(4)：0

总结：如果为true，就相当于数字1；为false，相当于数字0

4.与=的区别

先看==号
```
 <script type="text/javascript">
  var a=5;
  var b="5";
  if(a==5){
	  alert("6");
  }else{
	  alert("other");
  }
   </script>
```
当if里面的变量a换成b时，还是弹出6。证明==判断的是值，与变量的类型无关。

再把改为=

弹出结果为other，所以===比较值和类型。

5.直接在页面上输出

document.write();
注意事项
- document.write()里面是双引号，若给标签设置应该为单引号
- document.write()可以输出变量和html代码。
- document.write()可以输出数字不加双引号
例子：打印一个9*9乘法表
```
<!doctype html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html ; charset=UTF-8">
  <title>javascript</title>
 </head>
 <body>
   <script type="text/javascript">
		document.write("<table border='1' bordercolor='red'>");
		  for(var i=1;i<10;i++){
			  document.write("<tr>");
			  for(var j=1;j<i+1;j++){
			  document.write("<td>"+j+"*"+i+"="+i*j+"&nbsp&nbsp</td>");
			  }
			  document.write("</tr>");
		  }
	   document.write("</table>");
   </script>
 </body>
</html>
```
五.js的数组

js数组没有java的类型限制，可以存放不同的数据类型，它的定义方式有三种：
- var arr=[1,"3",true];
- var arr=new Array(5); //设置长度为5的数组。若Array("5")，意思是长度为1，内容为5的数组
- arr[0]="1";
- arr[2]=true;
- var arr=new Array(3,"4",5);
数组的长度：与java一样，为arr.length

对数组的操作:数组长度是可以变化的
引用：详细操作

遍历数组：可以用for……in遍历数组
```
var row = ['zhangsan','lisi','wangwu','xiaoqiang'];

for (var i in row){
  document.write(i + ':' + row[i] + '<br>');
}    
```
六.js的符号含义
- ()表示函数执行
- []表示语法模拟，表示模拟Array类的实例（=new Array()）
- {}表示语法模拟，表示模拟Object类的实例（=new Object()）
- //表示语法模拟（正则对象），表示模拟RegExp类的实例（=new RegExp()）
七.js的函数

js定义函数不像java那么麻烦，有三种方式可以定义：

1.关键字function
```
/*
 function 方法名(参数列表){
    方法体；
    返回值，可有可无，根据实际需要
 }
 */
function add(a,b){
		var sum=a+b;
		alert(sum);
	}
function add1(a,b,c){
		var sum=a+b+c;
		return sum;
	}
	//add(3,6);
	alert(add1(2,3,4));
```
2.匿名函数：想要调用就需要起一个名字
```
/*
var  方法名 = function(参数列表){
    方法体；
    返回值，可有可无，根据实际需要
 }
 */
  var add=function (a,b){
		var sum=a+b;
		alert(sum);
	}
	add(5,8);
 
```
3.Function
也称为动态函数，比较少用
```
/*
var add=new Function("参数列表","方法体和返回值")
*/
var add=new Function("x,y","var sum=x+y;return sum");
alert(add(3,5));//答案为8
```
1.js的全局变量与局部变量
- 全局变量：定义在全局的变量，这个变量在页面中的js部分都可以使用
- 局部变量：定义在方法内部的变量
```
  <script type="text/javascript">
	   var aa="44";//全局变量,下面三个都会弹窗
	   alert("在方法外部调用： "+aa);
	   function test(){
		alert("在方法内部调用： "+aa);
	   }
	   test1();
   </script>
   <script type="text/javascript">
		alert("在别的script调用： "+aa);
   </script>
```
2.script标签放置位置

关于这点网上有很多讨论，鉴于我学习的知识不多，只讨论其中一点：
html文件是自上而下的执行方式，css引入执行加载时，程序仍然往下执行，而执行到<script>脚本是则中断线程，待该script脚本执行结束之后程序才继续往下执行。
所以，一般将script放在body之后是因为避免长时间执行script脚本而延迟阻塞，加快访问速度。
而有一些页面的效果的实现，是需要预先动态的加载一些js脚本，所以这些脚本应该放在<body>之前。
其次，不能将需要访问dom元素的js放在body之前，因为此时还没有开始生成dom，所以在body之前的访问dom元素的js会出错，或者无效。就是因为这个，在dom没生成好时我就给它添加了方法，才导致这样。

总结：一般放在body后；有预加载的放在body前，不能将需要访问dom元素的js放在body之前。
查看全文

相关阅读:
重定向请求
 json处理
 post请求
 get请求
 提交cookie登录
 进击的Python【第三章】：Python基础(三)
进击的Python【第二章】：Python基础(二)
进击的Python【第一章】：Python背景初探与Python基础(一)
java 内存分析
 java--循环练习

原文地址：https://www.cnblogs.com/ikonon/p/7787779.html

(1)Javascript基础

一.简介

二.js的原始类型和声明变量

三.js中的条件判断语句

四.js中的运算符

1.数据类型差别

2.字符串的相加减

3.boolean类型的加减

4.与=的区别

5.直接在页面上输出

五.js的数组

六.js的符号含义

七.js的函数

1.js的全局变量与局部变量

2.script标签放置位置