js完整教程一 : 基本概念和数组操作

章提纲

  • JS相关常识
  • JS基本概念
  • 实践

  • 总结

 

JS相关常识

js是如出一辙种植可以与HTML标记语言混合使用的脚本语言,其修的次第可以一直当浏览器被说施行。

一、组成

js是一样种植特别为网页交互设计之脚本语言。由三有的组成:
1.ECMAScript (ECMA-262定义), 提供基本语言功能

2.文档目标模型(DOM),
提供访问与操作网页内容的道与接口

3.浏览器对象模型(BOM),
提供以及浏览器交互的艺术和接口

 

次、如何采取

HTML
中之剧本必须在 <script> 与 </script> 标签中。

剧本可为停放于
HTML 页面的 <body> 或 <head> 部分中。

内联方式:

<script>

alert(“My First
JavaScript”);

</script>

应用外部文件措施:

<script
src=”myScript.js”></script>

说明:

早先要在script中入type属性:<script
type=”text/javascript”>

今昔已经不用如此做了。

JavaScript
是持有现代浏览器中的默认脚论语言。

补充说明:

HTML
4.01为<script>定义了6个属性

type —
代表内容类型,默认为 text/javascript

src —
源地址,可跨域

async —
不保险按梯次执行

defer —
就下载,延迟执行,按顺序

charset —
大多数浏览器忽略,很少用

language — 已废弃

 

老三、语法说明

多数同C#仿佛,主要出几下蛋几乎接触。

1.
宣称变量。JavaScript
是如出一辙栽弱类型的脚本语言,直接用var声明变量,变量名分别轻重缓急写。

var message;

比如说这样未经初始化的变量,会保留一个非同寻常的价值,undefined.

 

var message=”hi”;

譬如这样初始化变量并无会见拿它们标志为字符串类型。

初始化的经过即为变量赋一个价值那么简单。

据此,可以于改动量值的而修改值的类别,例如

var message=
“hi”;

message = 100 ;
// 有效而切莫推荐

说明:

可不加 var
关键字声明变量, 这个变量会成全局变量, 建议总是用var。

全局变量:

在措施外部声明的变量;

措施中,没有加var关键字声明的变量。

 

有些变量:

方法中,使用var声明的变量    

2.
随规矩,标志符采用驼峰格式

3.
诠释:单行和块级

图片 1

证明:块级注释中间的 *
非必须,建议加,提高可读性。

 

  1. 语句

    盖 ;
    结尾。最佳实践:始终在决定语句被应用代码块,以提高可读性。

图片 2

 

基本概念

数据类型

ECMAScript中,
数据类型包括5栽为主型和1种复杂类型.

核心数据类:Number、Boolean、String、Undefined、Null

Number包括:整数和小数(最高精度17各小数)、NaN、Infinity,
-Infinity

注意:

对Number来说

1.除10上制外,还而由此8进制和16进制的字面值来代表,

如 070
表示56、0xA表示10.

2.小数为浮点类型,if(0.1+0.2
== 0.3) //不要做这么的测试,因为    
浮点数值最高精度是17位,是0.300000000000000004

除此以外两只例外基本类型的证明

Undefined:表示变量声明但非予以值.

Null :
表示一个拖欠的靶子引用(也即是赋值为null)

 

复杂数据类 —
Object, 这个累文章专门再介绍。

 

typeof 操作符

翻看类型时,经常会面使typeof运算符,
例如 typeof(10) 返回 number类型。

完整的归列表

返回值

说明

undefined

未定义

boolean

布尔值

string

字符串

number

数值

object

对象或null

function

函数

 

说明:

  1. 顾起一个突出:
    typeof(null) 返回object

从逻辑角度看,null值表示一个缺损对象指针,因此typeof会返回object

  1. undefined
    类型只生一个价,即undefined

图片 3

宣示不定义和无声明的变量不一致

图片 4

莫声明了之变量只能实行同样种操作,即使有typeof检测其种类

图片 5

 

辩论实践

下面就跟着自己做尝试。

骨干类型

合发生以下几栽情景。

图片 6

针对整数来说,我们常常因此底一个操作就是用字符串转变成整数。

//parseInt鲜个例证

parseInt(“10”);            //返回
10

var n11 =
parseInt(‘ab’); //NaN

var n12 =
parseInt(’11ab’); //11

 

下分别定义
String类型,Undefined类型,Null类型

/*
基本数据类的String类型 */

var str =
“字符串类型”;

//alert(str);

 

/*
基本数据列的Undefined类型 */

var n21;
//表示变量声明了不过切莫为赋值

//alert(n21);

 

/*
基本数据列的Null类型 */

var n31 = null;
//表示空的对象引用(赋值为null)

//alert(n31);

 

援类型

/* 引用数据类型
举例 */

var obj = {};
//对象

var arr = [1, 2,
3]; //数组

var date = new
Date(); //当前日子

//alert(date);

说明:

援类型比较复杂,下面专门讲一下频组,其他引用类型后续文章会特地有相同篇进行介绍。

数组常用操作, 重点

数组本身吗是目标,js中数组与C#不一样。

长度任意更改,每一样宗可以是例外档次。

脚是数组操作的事例。

定义

数组可以用new的法吧得据此配面量来定义。

var arr1 = new
Array();

var arr2 = [1,
2, ‘aa’, new Date(), true];

//alert(arr1.length);

//alert(arr2);
//会自动转换成为string,效果同样于 arr2.toString()

长与移除元素

从尾部

//push和pop

var arr3 = [new
Date(), false];

var res =
arr3.push(1, 2, true); //push方法像数组中追加元素(返回值为新数组长度)

alert(arr3);
//arr3中长了1, 2, true三独要素

alert(res);
//返回的凡新数组的长 5

var res2 =
arr3.pop(); //从数据尾部移除一个因素,返回值为移除的要素

alert(arr3);

alert(res2);
//返回值为移除的素

 

从头部

//shift和unshift

var arr4 = [1,
2, true, new Date()];

var res4 =
arr4.shift(); //从头部移除一个要素(返回移除的元素)

 

var res5 =
arr4.unshift(10, false); //从头部插入多只要素,返回新数组元素个数

alert(res5);

 

截取

/*

splice和slice(截取相关),返回去的要素

splice方法操作数组本身

slice不操作数组本身

*/

var arr5 = [1,
2, 3, 4, 5];

//splice(起始位置,截取的个数,第三只参数和随后表示:插入到截取位置的新因素)

var res6 =
arr5.splice(1, 2, 3, 4, 5);

//alert(arr5);
//1,3,4,5,4,5

//alert(res6);
//返回删除的元素 2,3

 

var arr6 = [1,
2, 3, 4, 5];

var res7 =
arr6.slice(2, 4); //左闭右起,语法arrayObject.slice(start,end)

//alert(arr6);
//和本平不转换

//alert(res7);
//返回删除的元素 3,4

 

拼接

concat()
方法用于连接两只或多只数组。

欠措施不见面转现有的频繁组,而仅仅会回来给连续数组的一个副本。

语法:arrayObject.concat(arrayX,arrayX,……,arrayX)

 

//concat 和 join
都非改动原数组

var arr7 = [1,
2, 3];

var arr8 =
[true, 4, 5];

 

var res8 =
arr7.concat(arr8); //合并操作,不操作原数组本身

//alert(res8);
//返回合并后的多次组

 

var res9 =
arr7.join(“-“); //join()
方法用于把数组中的有所因素放入一个字符串。不传参数使用逗号分隔

//alert(res9);
//1-2-3

 

排序

语法:arrayObject.sort(sortby),sortby可选,规定排序顺序,必须是函数。

 

/*

sort正序排序

reverse
倒序排序(按照原的逐条反转)

*/

var arr9 = [1,
2, 4, 3, 5];

var arr10 = [1,
10, 2, 5, 3];

arr10.sort(); //
是遵照字母来排序的 1,10,2,3,5

arr9.reverse();
//按照原来的一一反转

document.write(arr10 + “<br />”);

默认的sort是按字母排序的,这样
10即会破在2的眼前。

我们得打定义个比函数作为参数,实现按数字大小排序。

如下:

function
sortNumber(a, b) {

return a – b

}

 

var arr = new
Array(6)

arr[0] = “10”

arr[1] = “5”

arr[2] = “40”

arr[3] = “25”

arr[4] = “1000”

arr[5] = “1”

 

//document.write(arr + “<br />”) //
10,5,40,25,1000,1

//document.write(arr.sort(sortNumber)) //
1,5,10,25,40,1000

说明:

比函数sortNumber(a, b)
具有两只参数 a 和
b,返回一个用于证明这简单个价值的相对顺序的数字。其回来值如下:

若 a 小于
b,在排序后底数组中 a 应该出现在 b 之前,则归一个仅次于 0 的价。

若 a 等于
b,则返回 0。

若 a 大于
b,则归一个不止 0 的价。

 

ECMAScript5 新特性

/* ECMAScript5
数组新特点补充

位置方法:indexOf
lastIndexOf

迭代方式:every
filter forEach some map

缩小方法:reduce
reduceRight

*/

var arr = [1, 2,
3, 4, 2, 1];

//位置方法:indexOf lastIndexOf 一个参数,表示要找的因素

var
index=arr.indexOf(2);

//document.write(index);

 

//两只参数(要摸索的元素,起始位置)

var index =
arr.indexOf(2, 2);

document.write(index);

//lastIndexOf,用法了一致,只不过由尾部向前搜

var index =
arr.lastIndexOf(2, 4);

document.write(index);

 

//迭代艺术:every filter forEach some map

//every,
与运算,全是true为true

var res =
arr.every(function(item, index, array) {

return item >
0;

})

//some,或运算,有一个true返回true

var res =
arr.some(function (item, index, array) {

return item >
3;

})

//document.write(res);

//filter将过滤后的结果返回

var res =
arr.filter(function (item, index, array) {

return item >
2;

})

//forEach,遍历每一样起实施措施

arr.forEach(function (item, index, array) {

//document.write(item+”<br/>”);

})

//map,
对素每一样项实施方,把新的结果回到

var res=
arr.map(function (item, index, array) {

return item * 2;

})

 

//左结合以及右结合方式:reduce reduceRight

var res =
arr.reduce(function (prev,cur,index,array) {

return prev +
cur;

})

//document.write(res);

 

总结

本篇首先介绍了JS相关的常识,作为学习准备。

对接下讲解了JS数据类型。

数据类型是上学外语言都必控制的基本概念。

根本讲解了援类型中数组的概念、特性、常用方法。

数组是最常用到的数据类型之一。

要熟练掌握数组的概念,添加和移除(从尾部push和pop;从头部unshift和shift),截取(splice和slice),拼接(concat
和 join),排序(sort,reverse)的常用操作。

 

有题目欢迎直接评价提问,祝学习提高:)