---恢复内容开始---

JavaScript 

JavaScript:是一门编译型的语言,比python语言还要弱类型的语言

JavaScript 分为三个部分:Ecmascript、dom、bom

Ecmascript: 核心部分

dom: 控制整个网页,也就是文档

bom: 浏览器的文档模型

浏览器只能够解释: html、 css 、javascript

JavaScript的引用方法

直接将代码写入script标签里

使用script标签下的src属性直接引入写好的js文件。

JavaScript语言的使用

在js中//是单行注释

/*  */是多行注释

alert:打印,在执行代码时,就会打印到弹出窗口上面。

var: 声明一个变量,在定义变量前,必须使用var声明这些变量开辟出相应的内存空间进行赋值,可以同时声明多个变量,用逗号分开。

在js中默认换行符是一条语句的结束,还可以使用 ‘;’分一条语句的结束符

在js中声明变量没有赋值默认是undefined.

命名规范:见名知意,建议前面加上一个数据类型的首字母 其它的和python定义变量是一样的

          

什么是常量: 定义不变的量

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
/* function sayHello(){
var hellostr='你好';
document.write(hellostr);
}
sayHello();*/
var a=10,b= 3,c;
console.log(a,b,c)
</script>
</body>
</html>

js的数据类型

基本数据类型

number:数据类型

string:字符串类型

boolean:布尔类型

undefined:只声明并没有赋值的变量,只有一个值:undefined

引用数据类型

object:栈的数据类型。也包含了一些特殊的数据类型,非基础数据类型都属于object数据类型

            

console.log: 打印,将代码在控制台上面打印出来 

typeof: 查看数据类型

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
var a=10;
console.log(a,typeof a)
var e=[11,22,33,44],f=(99,88,77,66)
console.log(e,typeof e)
console.log(f,typeof f )
</script>
</body>
</html>

js中运算符

计算运算符: + - * / % ++ --

++:自加1,只能够加1 使用方法是:变量++ 和++变量,它们的区别在于变量++是先赋值后计算;而++变量是先计算后赋值

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
var a=10;
ret=a++;
console.log(ret,a);

var b=10;
ret=++b;
console.log(ret,b);
</script>
</body>
</html>

比较运算符

>  >=  <  <=  !=  ==  ===  !==

==和!=: 比较时数据类型不同的话,js会自动给数据类型转换

=== 和!== :全等于和不全等于。 比较时,js内部不做任何转换

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
console.log(5==='5');
console.log(5!=='5');
console.log(5=='5');
console.log(5!='5');
</script>
</body>
</html>

逻辑运算符: && 与|| 或!非

赋值运算符:=  +=  -=  *=  /=

字符串运算符:+ 连接,两边操作数有一个或两个是字符串就做连接运算,如果没有值就当正号使用  

流程控制

if和else判断:

if 单分支格式:

  if(条件语句){

   执行语句

  }  

 

if 双分支格式:

  if(条件语句){

   执行语句

  }  

 else{

  执行语句

  }

if 多分支格式:

  if(条件语句){

   执行语句

  }  

 else if{

  执行语句

  }

  ……

  else{

  执行语句

      }

  

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
if (2=='2'){
console.log('ok')
}
if (2==='2'){
console.log('对')
}
else{
console.log('错')
}
var a=20;
if(a>20){
console.log('大')
}
else if(a<20){
console.log('小')
}
else{
console.log('对')
}
</script>
</body>
</html>

for循环语句:

遍历循环格式:

for(条件语句){

执行语句  

}

条件语句的格式:(var变量=值;判断条件;自加1)

条件循环格式:

for(avr i in 变量){

  执行语句

}

length: 计算长度

while循环语句:

  while(条件语句){

  执行语句

}

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
a=0
b=0
while (a<10){
b+=a;
a++
}
console.log(b)
</script>
</body>
</html>

switch case语句

switch(表达式){

  case条件语句;执行语句break;

  case 条件语句;执行语句break;……

}  

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
var a=2;
switch(a){
case 1:alert('星期一');break;
case 2:alert('星期二');break;
case 3:alert('星期三');break;
case 4:alert('星期四');break;
case 5:alert('星期五');break;
}
</script>
</body>
</html> default:如果输入的值与case后面的值对不上的话,就会执行下面的语句

函数

函数的定义各调用格式

function 函数名(形参){

  函数体

}

  函数名(实参)

可以在当前文件里的script标签里的任意地方调用这个函数

如果实参少于形参时默认返回NaN,NaN是一个数据,如果数字没有转换字符串成功的话就会出现

argument对象,将传入函数的参数值打包起来。

函数如果没有返回值的话默认返回undefined

匿名函数:

什么叫做匿名函数:没有名字的函数执行一次就会被回收

匿名函数的定义和调用

(function 函数名(形参){

  函数体  

})(实参)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function func(x,y,z){
return x+y+z;
}
console.log(func(3,5,11)); (function(x,y){
console.log(x+y)
})(1,4)
</script>
</body>
</html>
  

js的执行顺序是将所有的代码先编译一遍,然后在执行

前端 javascript的更多相关文章

  1. 前端JavaScript规范

    前端JavaScript规范 http://www.imooc.com/article/1402 http://greengerong.com/blog/2015/05/09/qian-duan-ja ...

  2. 实例演示 kino.razor (前端 Javascript 模板工具,Razor 风格)的使用

    前言 对于习惯了 ASP.NET MVC Razor 模板引擎的人来说,比如我,一直在寻找前端 Javascript 端的 Razor 模板工具.这之前,我也了解到很多Javascript 端的模板工 ...

  3. 在C#后端处理一些结果然传给前端Javascript或是jQuery

    在C#后端处理一些结果然传给前端Javascript或是jQuery,以前Insus.NET有做过一个例子<把CS值传给JS使用 >http://www.cnblogs.com/insus ...

  4. 前端javascript模板

    doT.js——前端javascript模板引擎问题备忘录 我手里维护的一个项目,遇到一个问题:原项目的开发人员在Javascript中,大量的拼接HTML,导致代码极丑,极难维护.他们怎么能够忍受的 ...

  5. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  6. 前端javascript

    前端 JavaScript   javaScript----数据库jquery $(function(){ 执行代码   });  基本语法:$(selector).action() $(" ...

  7. Fundebug前端JavaScript插件更新至1.2.0

    摘要: Fundebug的前端JavaScript错误监控插件更新至1.2.0:支持监控WebSocket连接错误:修复了监控unhandledrejection错误的BUG,即未用catch处理的P ...

  8. Fundebug前端JavaScript插件更新至1.8.2,修复2个小BUG

    摘要: 修复2个BUG,请大家及时更新. Fundebug前端异常监控服务 Fundebug是专业的程序异常监控平台,我们JavaScript插件可以提供全方位的异常监控,可以帮助开发者第一时间定位各 ...

  9. Web前端-JavaScript基础教程下

    Web前端-JavaScript基础教程下 <script>有6个属性: async对外部脚本有效,可以用来异步操作,下载东西,不妨碍其他操作. charset为src属性指定字符集. d ...

  10. 前端 JavaScript 复制粘贴的奥义——Clipboard 对象概述

    前言 作为一名资深搬砖工,你要问我用得最熟练的技能是什么,那我敢肯定且自豪的告诉你:是 Ctrl+C !是 Ctrl+V! 不信?你来看看我键盘上的 Ctrl.C 和 V 键,那油光发亮的包浆程度,不 ...

随机推荐

  1. 数据分析三剑客之一numpy

    NumPy系统是Python的一种开源的数值计算扩展.这种工具可用来存储和处理大型矩阵. 可以用python实现的科学计算包括: 1.一个强大的N维数组对象Array: 2.比较成熟的(广播)函数库: ...

  2. jQuery取得radio的值 取select得值

    获取一组单选按钮对象: var obj_payPlatform = $('#wrap input[name="payMethod"]'); 获取被选中按钮的值 : var val_ ...

  3. 元组拆包 与 python拆包

    一.元组拆包(元组解包.迭代解包) 元组拆包可以应用到任何可迭代对象上(任何迭代对象),被可迭代对象中的元素数量必须要跟接受这些元素的元组的空档数一致.也可以使用用 * 来表示忽略多余的元素. 一般的 ...

  4. zabbix基础使用--添加ping监控

    1.添加item key值表示的含义:icmpping[<target>,<packets>,<interval>,<size>,<timeout ...

  5. lets encrypt与openssl结合实现双认证

    lets encrypt,是一个免费的证书认证机构,不需要导入根证书.但是这个认证机构只能认证服务端的,如果想要实现双认证,lets encrypt就不行了. openssl可以自签发,可以进行双认证 ...

  6. I2C与SMBus

    关于I2C与SMBus,许多人很少去谈论与了解两者的细节差异,包括很多国外的简报,文章也经常将两者混写.交杂描述.交替运用. 确实,在一般运用下,I2C Bus与SMBus没有太大的差别,从实际接线上 ...

  7. Ubuntu 16.04 上安装 PCL 1.8.0

    Ubuntu16.04之后安装pcl可以直接apt-get sudo apt-get install libpcl-dev pcl-tools 安装之前,准备一些依赖库 sudo apt-get up ...

  8. Xcode9模拟器隐藏边框

    选中模拟器,在Mac顶部菜单栏找到Window-->Show Device Bezeles 取消勾选代表去除黑边,勾选代表展示黑边,根据个人喜好设置吧

  9. ASP.NET Core下发布网站图解

    与ASP.NET时代不同,ASP.NET Core不再是由IIS工作进程(w3wp.exe)托管,而是使用自托管Web服务器(Kestrel)运行,IIS则是作为反向代理的角色转发请求到Kestrel ...

  10. winform使用PrintDocument控件打印以及oledb驱动

    代码,需要加入的控件:PrintDocument.PageSetupDialog.PrintDialog.PrintPreviewDialog.BackgroundWorker,控件的Document ...