美文网首页
javaScript基础学习记录篇-1

javaScript基础学习记录篇-1

作者: 赖兔宝 | 来源:发表于2020-06-15 11:02 被阅读0次

 1.JavaScript 对大小写敏感

所有 JavaScript 标识符对大小写敏感

变量 lastName 和 lastname,是两个不同的变量。

JavaScript 不会把 VAR 或 Var 译作关键词 var

2.历史上,程序员曾使用三种把多个单词连接为一个变量名的方法:

连字符:

first-name, last-name, master-card, inter-city.

注释:JavaScript 中不能使用连字符。它是为减法预留的。

下划线:

first_name, last_name, master_card, inter_city.

驼峰式大小写(Camel Case):

FirstName, LastName, MasterCard, InterCity.

JavaScript 程序员倾向于使用以小写字母开头的驼峰大小写:

firstName, lastName, masterCard, interCity

3.JavaScript 字符集

JavaScript 使用 Unicode 字符集。

Unicode 覆盖世界上几乎所有的字符、标点和符号。

4.赋值运算符

在 JavaScript 中,等号(=)是赋值运算符,而不是“等于”运算符。

这一点与代数不同。下面的代码在代数中是不合理的:

x = x + 5

然而在 JavaScript 中,它非常合理:把 x + 5 的值赋给 x。

(计算 x + 5 的值并把结果放入 x 中。x 的值递增 5。)

注释:JavaScript 中的“等于”运算符是 ==。

5.undefined出现几种可能性:

申明了为赋值,var a 这个a的值就是undefined

提示:在脚本的开头声明所有变量是个好习惯!

var person = undefined;// 值是 undefined,类型是 undefined

6.JavaScript 算术

var x = "8" + 3 + 5;//console.log(835);

提示:如果把要给数值放入引号中,其余数值会被视作字符串并被级联。

var x = 3 + 5 + "8";//console.log(88);

7.typeof 运算符

您可使用 JavaScript 的 typeof 来确定 JavaScript 变量的类型:

typeof 运算符返回变量或表达式的类型

typeof 运算符对数组返回 "object",因为在 JavaScript 中数组属于对象。

在 JavaScript 中,null 是 "nothing"。它被看做不存在的事物。

不幸的是,在 JavaScript 中,null 的数据类型是对象。

8.Undefined 与 Null 的区别Undefined 与 null 的值相等,但类型不相等:

typeof undefined // undefined 

typeof null // object 

null === undefined // false 

null == undefined // true 

9.() 运算符调用函数

使用上面的例子,toCelsius 引用的是函数对象,而 toCelsius() 引用的是函数结果。

实例

访问没有 () 的函数将返回函数定义:

function toCelsius(fahrenheit) {

    return (5/9) * (fahrenheit-32);

}

document.getElementById("demo").innerHTML = toCelsius; //function toCelsius(f) { return (5/9) * (f-32); }

10.局部变量

在 JavaScript 函数中声明的变量,会成为函数的局部变量

局部变量只能在函数内访问。

由于局部变量只能被其函数识别,因此可以在不同函数中使用相同名称的变量。

局部变量在函数开始时创建,在函数完成时被删除。

11.字符串可以是对象

var x = "Bill"; // typeof x 将返回 string

var y = new String("Bill"); // typeof y 将返回 object

12.字符串的方法和属性

原始值,比如“Bill Gates”,无法拥有属性和方法(因为它们不是对象)。

但是通过 JavaScript,方法和属性也可用于原始值,因为在执行方法和属性时 JavaScript 将原始值视为对象。

字符串长度

length 属性返回字符串的长度

查找字符串中的字符串

1.indexOf() 方法返回字符串中指定文本首次出现的索引(位置)

var pos = str.indexOf("China");

2.lastIndexOf() 方法返回指定文本在字符串中最后一次出现的索引

var pos = str.lastIndexOf("China");

如果未找到文本, indexOf() 和 lastIndexOf() 均返回 -1。

两种方法都接受作为检索起始位置的第二个参数。

var pos = str.indexOf("China", 18);//从第18位开始查找china

var pos = str.lastIndexOf("China", 50);

lastIndexOf() 方法向后进行检索(从尾到头),这意味着:假如第二个参数是 50,则从位置 50 开始检索,直到字符串的起点。

检索字符串中的字符串

3.search() 方法搜索特定值的字符串,并返回匹配的位置

两种方法,indexOf() 与 search(),是取值相等的。

这两种方法用法是不相等的。区别在于:

search() 方法无法设置第二个开始位置参数。

indexOf() 方法无法设置更强大的搜索值(正则表达式)

4.slice() 提取字符串的某个部分并在新字符串中返回被提取的部分。

var str = "Apple, Banana, Mango";

var res = str.slice(7,13); //Banana

如果某个参数为负,则从字符串的结尾开始计数。

var res = str.slice(-13,-7); //Banana

如果省略第一个参数,则该方法将裁剪字符串的剩余部分:

var res = str.slice(7);//Banana, Mango

提示:负值位置不适用 Internet Explorer 8 及其更早版本。

5.substring() 方法

substring() 类似于 slice()。

不同之处在于 substring() 无法接受负的索引。

var res = str.substring(7,13);//Banana

6.substr() 方法

substr() 类似于 slice()。

不同之处在于第二个参数规定被提取部分的长度

var str = "Apple, Banana, Mango";

var res = str.substr(7,6); //Banana

7.替换字符串内容

replace() 方法用另一个值替换在字符串中指定的值:

str = "Please visit Microsoft!";

var n = str.replace("Microsoft", "W3School");

replace() 方法不会改变调用它的字符串。它返回的是新字符串。

默认地,replace() 只替换首个匹配

str = "Please visit Microsoft and Microsoft!";

var n = str.replace("Microsoft", "W3School"); // 请访问 W3School 和 Microsoft!

默认地,replace() 对大小写敏感。因此不对匹配 MICROSOFT:

8.通过 toUpperCase() 把字符串转换为大写:

9.通过 toLowerCase() 把字符串转换为小写:

10.concat() 方法

concat() 连接两个或多个字符串:

var text = "Hello" + " " + "World!";

var text = "Hello".concat(" ","World!");

所有字符串方法都会返回新字符串。它们不会修改原始字符串。

正式地说:字符串是不可变的:字符串不能更改,只能替换。

11.String.trim() 方法

trim() 方法删除字符串两端的空白符:

var str = " Hello World! ";

alert(str.trim());

警告:Internet Explorer 8 或更低版本不支持 trim() 方法。

12.charAt() 方法

charAt() 方法返回字符串中指定下标(位置)的字符串:

var str = "HELLO WORLD";str.charAt(0);// 返回 H

13.charCodeAt() 方法

charCodeAt() 方法返回字符串中指定索引的字符 unicode 编码:

var str = "HELLO WORLD";str.charCodeAt(0);// 返回 72

14.把字符串转换为数组

可以通过 split() 将字符串转换为数组:

15.NaN - 非数值

NaN 属于 JavaScript 保留词,指示某个数不是合法数。

尝试用一个非数字字符串进行除法会得到 NaN(Not a Number):

var x = 100 / "Apple";// x 将是 NaN(Not a Number)

您可使用全局 JavaScript 函数 isNaN() 来确定某个值是否是数:

eg:var x = 100 / "Apple";isNaN(x);// 返回 true,因为 x 不是数

eg:var x = NaN;var y = 5;var z = x + y;// z 将是 NaN

NaN 是数,typeof NaN 返回 number:

15.Infinity(无穷)

Infinity (或 -Infinity)是 JavaScript 在计算数时超出最大可能数范围时返回的值。

除以 0(零)也会生成 Infinity:

var x = 2 / 0;// x 将是 Infinity

var y = -2 / 0;// y 将是 -Infinity

Infinity 是数:typeOf Infinity 返回 number。

16.十六进制

JavaScript 会把前缀为 0x 的数值常量解释为十六进制。

使用 toString() 方法把数输出为十六进制、八进制或二进制。

var myNumber = 128;

myNumber.toString(16);// 返回 80

myNumber.toString(8);// 返回 200

myNumber.toString(2);// 返回 10000000

17.toString() 方法

toString() 方法以逗号分隔的字符串返回数组:

var x = 123;

x.toString();// 从变量 x 返回 123

(123).toString();// 从文本 123 返回 123

(100 + 23).toString();// 从表达式 100 + 23 返回 123

18.toExponential() 方法(看看就好了)

toExponential() 返回字符串值,它包含已被四舍五入并使用指数计数法的数字。

var x = 9.656;

x.toExponential(2);// 返回 9.66e+0

x.toExponential(4);// 返回 9.6560e+0

x.toExponential(6);// 返回 9.656000e+0

19.toFixed() 方法

toFixed() 返回字符串值,它包含了指定位数小数的数字:

toFixed(2) 非常适合处理金钱。

var x = 9.656;

x.toFixed(0);// 返回 10

x.toFixed(2);// 返回 9.66

x.toFixed(4);// 返回 9.6560

x.toFixed(6);// 返回 9.656000

20.toPrecision() 方法

toPrecision() 返回字符串值,它包含了指定长度的数字:

var x = 9.656;

x.toPrecision();// 返回 9.656

x.toPrecision(2);// 返回 9.7

x.toPrecision(4);// 返回 9.656

x.toPrecision(6);// 返回 9.65600

21.valueOf() 方法

valueOf() 以数值返回数值:

var x = 123;

x.valueOf();// 从变量 x 返回 123

(123).valueOf();// 从文本 123 返回 123

(100 + 23).valueOf();// 从表达式 100 + 23 返回 123

22.把变量转换为数值

这三种 JavaScript 方法可用于将变量转换为数字:

Number() 方法

parseInt() 方法

parseFloat() 方法

这些方法并非数字方法,而是全局 JavaScript 方法。

如果无法转换数字,则返回 NaN。

用于日期的 Number() 方法

Number() 还可以把日期转换为数字:

Number(new Date("2019-04-15")); // 返回 1506729600000

23.把数组转换为字符串

JavaScript 方法 toString() 把数组转换为数组值(逗号分隔)的字符串。

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.getElementById("demo").innerHTML = fruits.toString();

//Banana,Orange,Apple,Mango

24.数组排序

sort() 方法是最强大的数组方法之一。

1》数组排序

sort() 方法以字母顺序对数组进行排序:

2》反转数组

reverse() 方法反转数组中的元素。

您可以使用它以降序对数组进行排序:

比值函数

比较函数的目的是定义另一种排序顺序。

比较函数应该返回一个负,零或正值,这取决于参数:

function(a, b){return a-b}

当 sort() 函数比较两个值时,会将值发送到比较函数,并根据所返回的值(负、零或正值)对这些值进行排序。

实例:

当比较 40 和 100 时,sort() 方法会调用比较函数 function(40,100)。

该函数计算 40-100,然后返回 -60(负值)。

排序函数将把 40 排序为比 100 更低的值。

以随机顺序排序数组

实例

var points = [40, 100, 1, 5, 25, 10];

points.sort(function(a, b){return 0.5 - Math.random()});

查找最高(或最低)的数组值

思路,先排序然后找最大最小

var points = [40, 100, 1, 5, 25, 10];

升序排序:

points.sort(function(a, b){return a - b});

document.getElementById("demo").innerHTML = points[0]; //1

降序排序:

var points = [40, 100, 1, 5, 25, 10];

points.sort(function(a, b){return b - a});

document.getElementById("demo").innerHTML = points[0]; //1

join() 方法也可将所有数组元素结合为一个字符串。

它的行为类似 toString(),但是您还可以规定分隔符:

pop() 方法从数组中删除最后一个元素:

push() 方法(在数组结尾处)向数组添加一个新的元素:

unshift() 方法(在开头)向数组添加新元素,并“反向位移”旧元素:

length 属性提供了向数组追加新元素的简易方法:

既然 JavaScript 数组属于对象,其中的元素就可以使用 JavaScript delete 运算符来删除

splice() 方法可用于向数组添加新项:

    第一个参数(2)定义了应添加新元素的位置(拼接)。

    第二个参数(0)定义应删除多少元素。

    其余参数(“Lemon”,“Kiwi”)定义要添加的新元素。

使用 splice() 来删除元素

通过聪明的参数设定,您能够使用 splice() 在数组中不留“空洞”的情况下移除元素:

    fruits.splice(0, 1);

    第一个参数(0)定义新元素应该被添加(接入)的位置。

    第二个参数(1)定义应该删除多个元素。

    其余参数被省略。没有新元素将被添加。

合并(连接)数组

    concat() 方法通过合并(连接)现有数组来创建一个新数组:

    concat() 方法不会更改现有数组。它总是返回一个新数组。

    concat() 方法可以使用任意数量的数组参数:

裁剪数组

    slice() 方法用数组的某个片段切出新数组。

    本例从数组元素 1 ("Orange")开始切出一段数组:

对数组使用 Math.max()

您可以使用 Math.max.apply 来查找数组中的最高值:

var points = [40, 100, 1, 5, 25, 10];

document.getElementById("demo").innerHTML = myArrayMax(points);

function myArrayMax(arr) {

  return Math.max.apply(null, arr);

}

对数组使用 Math.min()

您可以使用 Math.min.apply 来查找数组中的最低值:

var points = [40, 100, 1, 5, 25, 10];

document.getElementById("demo").innerHTML = myArrayMin(points);

function myArrayMin(arr) {

  return Math.min.apply(null, arr);

}

数组对象排序

var cars = [

{type:"Volvo", year:2016},

{type:"Saab", year:2001},

{type:"BMW", year:2010}];

cars.sort(function(a, b){return a.year - b.year});

相关文章

网友评论

      本文标题:javaScript基础学习记录篇-1

      本文链接:https://www.haomeiwen.com/subject/ymgstktx.html