前端之JS (上)

JavaScript

学习前端脚本语言javascript的基本概念、页面引入方式、获取页面元素及操做元素属性的技巧，学习函数的基本定义方法和使用方法。

 

什么是JavaScript？

JavaScript是运行在浏览器端的脚步语言，JavaScript主要解决的是前端与用户交互的问题，包括使用交互与数据交互。 JavaScript是浏览器解释执行的，前端脚本语言还有JScript（微软，IE独有），ActionScript( Adobe公司，须要插件)等。

1. JavaScript 是一种客户端脚本语言（脚本语言是一种轻量级的编程语言）。 2. JavaScript 一般被直接嵌入 HTML 页面。 3. JavaScript 是一种解释性语言（就是说，代码执行不进行预编译）。

特色：

1. 弱类型 2. 基于对象。(由于面向对象须要具备封装、继承、多态的特征) 3. 安全 4. 兼容性

JavaScript嵌入页面的方式

一、行间事件（主要用于事件）

<input type="button" name="" onclick="alert('ok！');"> 

二、页面script标签嵌入

<script type="text/javascript"> var a = '你好！'; alert(a); </script> 

三、外部引入

<script type="text/javascript" src="js/index.js"></script> 

 

Javascript语句与注释

一、一条javascript语句应该以“;”结尾

<script type="text/javascript"> var a = 123; var b = 'str'; function fn(){ alert(a); }; fn(); </script> 

二、javascript注释

<script type="text/javascript"> // 单行注释 var a = 123; /* 多行注释 一、... 二、... */ var b = 'str'; </script> 

js变量

JavaScript 是一种弱类型语言，javascript的变量类型由它的值来决定。

定义变量须要用关键字 'var',不使用var关键字定义全局变量在严格模式下将会执行错误 "use strict";

var a = 123; var b = 'asd'; //同时定义多个变量能够用","隔开，公用一个‘var’关键字 var c = 45,d='qwe',f='68';

变量、函数、属性、函数参数命名规范

字母数字下划线($) 首字母不能为数字 严格区分大小写 不能使用关键字

基本数据类型：

typeof函数获取一个变量的类型：

* boolean - 若是变量是 Boolean 类型的 * number - 若是变量是 Number 类型的 (整数、浮点数) * string - 若是变量是 String 类型的 （采用""、 ''） * object - 若是变量是一种引用类型或 Null 类型的 如：new Array()/ new String()... * function -- 函数类型 * undefined - 若是变量是 Undefined 类型的 

Js数据类型转换

使用：Number（）、parseInt() 和parseFloat（） 作类型转换

Number()强转一个数值(包含整数和浮点数)。 *parseInt()强转整数， *parseFloat（）强转浮点数

函数isNaN()检测参数是否不是一个数字。

isNaN() is not a number

ECMAScript 中可用的 3 种强制类型转换以下：

Boolean(value) - 把给定的值转换成 Boolean 型； Number(value) - 把给定的值转换成数字（能够是整数或浮点数）；  String(value) - 把给定的值转换成字符串；

Js运算符

算 字 赋 比 逻 位 它

算术运算符

+ - * / ++ --

字符串链接

+

赋值运算

= += -= %=

比较运算符

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

逻辑运算符

&& || !

位运算

^ & | << >>

Js流程控制

流程控制用于基于不一样的条件来执行不一样的动做。

If 语句

if... else ...

if ... else if ... else...

能够单分支,双分支,也能够多分支,须要注意 else if中间必需要有空格

if (condition){ //当条件为 true 时执行的代码 }else{ //当条件不为 true 时执行的代码 } 

switch 语句

多分支语句： switch（）{。 case ：。。。。}

switch 语句用于基于不一样的条件来执行不一样的动做。

switch(n){ case 1: //执行代码块 1 break; case 2: //执行代码块 2 break; default: //与 case 1 和 case 2 不一样时执行的代码 } 

Js循环

程序中进行有规律的重复性操做，须要用到循环语句。

break 和 continue 语句对循环中的代码执行提供了更严格的控制。

for循环

for(var i=0;i<len;i++){ ...... }

while循环

var i=0; while(i<8){ ...... i++; }

for-in 语句

for-in 语句是严格的迭代语句，用于枚举对象的属性。

var a = [10,20,30,40,50]; //迭代的是数组的下标。 for(i in a){ document.write(a[i]); } //输出： 1020304050