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

文章提纲

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

  • 总结

 

JS相关常识

js是1种能够与HTML标记语言混合使用的脚本语言,其编写制定的先后能够直接在浏览器中表达实施。

一、组成

js是一种专门为网页交互设计的脚本语言。由叁片段构成:
一.ECMAScript (ECMA-26二概念), 提供基本语言作用

贰.文书档案目的模型(DOM),
提供访问和操作网页内容的主意和接口

三.浏览器对象模型(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#好像,主要有几下几点。

一.
扬言变量。JavaScript
是一种弱类型的脚本语言,直接用var注明变量,变量名区分轻重缓急写。

var message;

像这么未经起首化的变量,会保留2个非正规的值,undefined.

 

var message=”hi”;

像那样开始化变量并不会把它标志为字符串类型。

起先化的进程正是给变量赋一个值那么粗略。

因此,能够在改动量值的同时修改值的种类,例如

var message=
“hi”;

message = 十0 ;
// 有效但不推荐

说明:

同意加 var
关键字证明变量, 那么些变量会化为全局变量, 提议总是选择var。

全局变量:

在艺术外部申明的变量;

方法内部,未有加var关键字注解的变量。

 

有的变量:

情势内部,使用var注明的变量    

二.
按规矩,标志符采纳驼峰格式

3.
诠释:单行和块级

图片 1

注解:块级注释中间的 *
非必须,提议加,进步可读性。

 

  1. 语句

    以 ;
    结尾。最好实践:始终在支配语句中利用代码块,以增进可读性。

图片 2

 

基本概念

数据类型

ECMAScript中,
数据类型包含多样基本类型和1种复杂类型.

基本数据类型:Number、Boolean、String、Undefined、Null

Number包蕴:整数和小数(最高精度十3人小数)、NaN、Infinity,
-Infinity

注意:

对Number来说

一.除10进制外,还可透过八进制和16进制的字面值来代表,

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

二.小数为浮点类型,if(0.壹+0.二== 0.3) //不要做那样的测试,因为    
浮点数值最高精度是1柒个人,是0.30000000000000000肆

除此以外三个奇特基本类型的辨证

Undefined:表示变量注解但未赋值.

Null :
表示3个空的靶子引用(也正是赋值为null)

 

复杂数据类型 —
Object, 那么些接二连三小说尤其再介绍。

 

typeof 操作符

查看类型时,平常会动用typeof运算符,
例如 typeof(10) 再次回到 number类型。

完全的回来列表

返回值

说明

undefined

未定义

boolean

布尔值

string

字符串

number

数值

object

对象或null

function

函数

 

说明:

  1. 只顾有一个新鲜:
    typeof(null) 重返object

从逻辑角度看,null值表示二个空对象指针,由此typeof会再次来到object

  1. undefined
    类型唯有1个值,即undefined

图片 3

宣示未定义与未注明的变量不一致

图片 4

从不表明过的变量只可以执行1种操作,即便有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 n贰1;
//表示变量评释了但未被赋值

//alert(n21);

 

/*
基本数据类型之Null类型 */

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

//alert(n31);

 

引用类型

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

var obj = {};
//对象

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

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

//alert(date);

说明:

引用类型相比复杂,上边专门讲一下数组,别的引用类型后续小说会专门有1篇进行介绍。

数组常用操作, 重点

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

长度任意改变,每1项能够是不一致类别。

上边是数组操作的事例。

定义

数组能够用new的秘籍也能够用字面量来定义。

var arr1 = new
Array();

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

//alert(arr1.length);

//alert(arr二);
//会自动转换来string,效果同样 arr二.toString()

加上和移除成分

从尾部

//push和pop

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

var res =
arr三.push(壹, 二, true); //push方法像数组中增港币素(再次来到值为新数老总度)

alert(arr3);
//arr3中追加了一, 2, true四个成分

alert(res);
//重临的是新数组的长短 5

var res二 =
arr三.pop(); //从数据尾巴部分移除3个因素,重返值为移除的因素

alert(arr3);

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

 

从头部

//shift和unshift

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

var res四 =
arr4.shift(); //从底部移除四个要素(重回移除的要素)

 

var res五 =
arr四.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);
//再次回到删除的因素 二,三

 

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

var res7 =
arr陆.slice(二, 四); //左闭右开,语法arrayObject.slice(start,end)

//alert(arr陆);
//和原先一样不变

//alert(res七);
//再次来到删除的要素 三,四

 

拼接

concat()
方法用于连接八个或七个数组。

该办法不会转移现有的数组,而仅仅会回去被连接数组的多少个副本。

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

 

//concat 和 join
都不转移原数组

var arr7 = [1,
2, 3];

var arr8 =
[true, 4, 5];

 

var res捌 =
arr7.concat(arr八); //合并操作,不操作原数组自身

//alert(res8);
//再次来到合并后的数组

 

var res玖 =
arr柒.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,十,2,3,5

arr九.reverse();
//按照原先的逐条反转

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

暗中同意的sort是遵守字母排序的,那样
十就会排在二的前面。

作者们须求自定义个相比较函数作为参数,落成按数字大小排序。

如下:

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 1个参数,表示要寻找的因素

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,遍历每1项执行措施

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

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

})

//map,
对成分每1项执行措施,把新的结果回到

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数据类型。

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

第一讲解了引用类型中数组的定义、性格、常用方法。

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

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

 

有失常态欢迎直接评价提问,祝学习进步:)