hercule_poirt
^

javaScript - 基础

JavaScript 语法重点

1.不能包含空格或者以数字为开头。

2.CamelCase 驼峰命名法

变量名的第一个单词的首写字母小写,后面的单词的第一个字母大写

3. JavaScript 允许使用单引号(')和双引号(")声明字符串。

决定使用哪一个通常看个人偏好。在不得不使用多个引号是,可以通过使用反斜杠(\)来转义字符串内的引号,如\’。

-------------------------------------------------------------------------------------------

JavaScript 特点

  1. 七种数据类型

undefined(未定义)、null(空)、boolean(布尔型true|flase)、string(字符串)、symbol(ES6新增)、number(数字)、bigint(可以表示任意大的整数)和 object(对象)。

boolean:

注意:在使用逻辑语句判定boolean的值为true or false是,如果传入1,有可能会视为true or false,可以通过使用===严格等于避免这点

boolean的转换:

Boolean(target)

在JavaScripe中除了undefined、null、0、-0、NaN、''会被转换成false,其他的值都会转换成true。

  1. Object对象

注意:在 JavaScript 中,数组在本质上是一种对象。

对象和 数组 类似,区别在于数组使用索引来访问和修改数据,而对象中的数据是通过 properties 访问的。

properties参数的设置,更自由,且没有引号限制

var anotherObject = {

  make: "Ford",
  5: "five",
  "model": "focus"
};
  1. 访问对象

访问对象属性有两种方式:点号表示法(.)和方括号表示法([])

可以通过连续使用点号表示法和方括号表示法来访问对象的嵌套属性。

注意:点号访问可以忽略引号,但是如果属性名中包含空格,就必须使用引号(单引号或双引号)将它们包裹起来。

Delete 删除对象的属性

delete ourDog.bark;
  1. 使用对象进行查找

注意:有值的变量查询应使用[],点号查询不支持变量

对象的查找时遍历式的,所以属性里不应该有执行命令!

var alpha = {
  1:"Z",
  2:"Y",
  3:"X",
  4:"W",
  ...
  24:"C",
  25:"B",
  26:"A"
};
alpha[2];//此处alpha[2]的值为Y
alpha[24];//此处alpha[24]的值为C
var value = 2;
alpha[value];//此处alpha[value]的值为Y
  1. 运算符

== 相等 会做类型转换

=== 严格相等运算符 不会做类型转换

!= 不等运算符 会做类型转换

!== 严格不等运算符 不会做类型转换

typeof 类型运算符 确定变量或值的类型

  1. 逻辑运算符

&& 两边都是true

|| 两边任意一个是True即是true

  1. 余数运算符 remainder “%” 求两个数相除的余数(不能用于负数)

例如 “17 % 2 = 1;”

  1. 复合赋值符号 “+=”  “-=”  “*=”  “/=” (“+=”也可用于字符串)

例如 myVar +=5; 即 myVar = myVar + 5;

  1. 转义引号 通过使用反斜杠(\)。来输出与语法冲突的字母符号

字符串输出的重点

例如 转义引号的使用为\” xxxxxxx\” 注意,结尾也是\”

\'     单引号       \"      双引号           \\      反斜杠

\n   换行符       \r      回车符           \t      制表符

\b   退格         \f      换页符

10.拼接操作符 “+” 连接字符串与字符串

11.字符串参数.length 获得字符串长度

方括号[number] 获取字符串number位字符(从零开始计数)

字符串参数的值是不可再赋值的

方括号[]内允许如 a.length – 1 的运算 注意:此处从1开始计数

12.数组array[],嵌套数组array[[1,2],[3,4]],数组索引array[1]

多维数组:第一个方括号访问的是数组的最外层(第一层),第二个方括号访问的是数组的第二层

例如 [[10,11,12], 13, 14]  输出array[0][0]=10

13.函数声明

1.普通声明

function functionName() {
  console.log("Hello World");
}

2.匿名声明

var x = function (a, b) {return a * b};
var z = x(4, 3);

上面的函数实际上是一个匿名函数(没有名称的函数)。

存放在变量中的函数不需要函数名。他们总是使用变量名调用。

3.Function()构造器(匿名函数的命名版本)

var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);

实际上无需使用函数构造器 New,像匿名函数一样用即可

var myFunction = function (a, b) {return a * b};
var x = myFunction(4, 3);

4.调用函数

functionName()

5.带有参数的函数声明

function testFun(param1, param2) {
  console.log(param1, param2);
}

6.调用函数,传入参数

testFun(“Hello”, “World”);

14.全局作用域和函数

在函数外var global           global为全局变量

在函数内声明var oopsglobal   oopsglobal为局部变量

在有相同名称的局部变量和全局变量时。局部变量的优先级更高,优先返回return局部变量

15.return 返回函数的值,true or false , undefined以及运算式的true or false

注意:

1.在函数没有 return 语句的情况下,当你调用它时,该函数会执行内部代码,返回的值是 undefined。

2.当代码执行到 return 语句时,函数返回一个结果就结束运行了,return 后面的语句不会执行。

16.三元运算符a ? b : c

where a 是条件,当条件返回 true 的时候运行代码 b,当条件返回 false 的时候运行代码 c。(你也可以将多个运算符串联在一起以检查多种条件)

javaScript 函数

  1. 1.   数组函数

(绝大多数的js数组函数都会有返回值的)

声明数组:var A=new Array();

a.在 JavaScript 中,数组在本质上是一种对象。

b.调用多维数组时,全部使用方括号,如Arr[i][j];

-------------------------------------------------------------------------------------------

.push() 在数组的末尾插入值。

插入值后返回的是长度

.pop() 在数组的末尾删除值。

我们可以把移除的值赋给一个变量存储起来。

.unShift() 在数组的头部插入值。

.shift() 在数组的头部删除值。

-------------------------------------------------------------------------------------------

splice( x,y,z )  在数组中的指定范围删除|添加任意数量的值。

第一个参数代表起始值的位置

第二个参数代表从初始值开始的连续数量

第三个参数代表要添加的一个或多个元素

-------------------------------------------------------------------------------------------

slice( x,y ) 复制指定范围的数组元素

第一个参数代表起始位置

第二个参数代表终止位置

注意:提取的元素中不包括第二个参数。

slice( x,y )等同于展开运算符[…TargetArrayName]

*展开运算符[…TargetArrayName]

在为函数建立引入参数的副本时,如果不使用展开运算符

将数组展开,可能会导致参数错误,建议使用展开运算符

展开运算符可以视为slice的简单写法,记得要用[...arr]

此外,展开运算符可以用来合并数组,如例

let thisArray = ['soda', 'beer', 'thyme'];

let thatArray = ['basil', ...thisArray, 'pepsi'];

-------------------------------------------------------------------------------------------

注意:indexOf不返回true or false,返回的是序号和-1

indexOf(‘xxx’) 检查元素在目标数组中是否存在

yyy.indexOf(‘xxx’)输入参数为一个元素

返回该元素在yyy中的位置(索引)

若该元素不存在于数组中则返回 -1。

-------------------------------------------------------------------------------------------

reduce() 计算数组元素相加后的总和.

接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

空数组的判断:双引号““单引号’’  注意[]不能代表空数组

  1. 2.   对象函数(js 中一切皆是对象)

 .hasOwnProperty(“xx”)  检查对象是否有指定的属性

返回值为True or false

users.hasOwnProperty('Alan');

使用in与使用.hasOwnProperty是一样的效果

'Alan' in users;

-------------------------------------------------------------------------------------------

Object.keys()

用来生成包含对象所有键的数组。 这会返回一个由对象中所有属性(字符串)组成的数组。

注意:数组中元素的顺序是不确定的。

 

  1. 3.   Math函数

1)Math.random()

生成一个在0(包括 0)到 1(不包括 1)之间的随机小数。

 可能返回 0,但绝不会返回 1。

 

2)Math.floor()

例中生成了一个在 0 到 19 之间的整数

Math.floor(Math.random() * 20);

math.floor() 向下取整,丢弃小数部分

 

3)n! 阶乘通常用符号 

例:

5! = 1 * 2 * 3 * 4 * 5 = 120

 

4)parseInt() 直接丢弃小数,保留整数部分 

  1. 4.   字符串函数

split()(将字符串转换为数组)

stringObject.split(separator,howmany)

separator 必需

字符串或正则表达式,从该参数指定的地方分割 stringObject。

howmany 可选

该参数可指定返回的数组的最大长度。

如果设置了该参数,返回的子串不会多于这个参数指定的数组。

如果没有设置该参数,整个字符串都会被分割,不考虑它的长度。

注意:如果写作无空格的split(“”),那么将以字母为单位分割。

如果写作有空格的split(“ ”),那么将以空格为分割线,每个元素是一个单词

转换大小写

toLowerCase() 把字符串转换为小写

toUpperCase() 把字符串转换为大写

-------------------------------------------------------------------------------------------

Java中字符串中子串的查找共有四种方法,如下:
1、int indexOf( ):返回第一次出现的指定子字符串在此字符串中的索引。 
2、int indexOf(str , int):从指定的索引处开始,返回第一次出现的指定子字符串在此字符串中的索引。 
3、int lastIndexOf( ):返回在此字符串中最右边出现的指定子字符串的索引。 返回的依然是从左开始的索引号
4、int lastIndexOf(str , int) :从指定的索引处开始向后搜索,返回在此字符串中最后一次出现的指定子字符串的索引。

  1. 5.   其他函数

parseInt()

解析一个字符串返回一个整数

如果字符串中的第一个字符不能转换为数字,则返回 NaN。

例中转换为了7

var a = parseInt("007");

使用 parseInt 函数并传入一个基数(目标进制数)

例如parseInt(“11”,2) 即将字符串 11 转换为二进制11对应 3

parseInt(string, radix);

javaScript 逻辑语句

通过在逻辑语句使用&& ||添加多个条件

1.If else

if(条件为真){
条件为真时,语句被执行
} else {

条件为假时,语句被执行

}

  1. 6.    Switch case

注意: javaScript的Switch case 使用严格比较(===)

switch(lowercaseLetter) {
  case "a":
    console.log("A");
    break;
  case "b":
    console.log("B");
    break;
  default:
    defaultStatement;
    break;
} 

注意:

1.case 值使用严格相等(===)运算符进行比较。

2.break 告诉 JavaScript 停止执行 switch 语句。

如果遗漏了 break ,下一个语句将会被执行。

3.While

当 while 指定的条件为真,循环才会执行,反之不执行。

var ourArray = [];

var i = 0;

while(i < 5) {

  ourArray.push(i);

  i++;

}

4.For

for (a; b; c)

 a 为初始化语句,b 是循环条件语句,c 是终止循环条件表达式。

var ourArray = [];

for (var i = 0; i < 5; i++) {

  ourArray.push(i);

}

 

4.1 for(...in...)语句遍历对象

for (let user in users) {
  console.log(user);
}

这将在控制台打印 Alan、Jeff、Sarah 和 Ryan - 每个值占一行。

实例:

我们已经定义了一个 countOnline 函数,它接收一个 users 对象参数。 请在其中使用 for...in 语句来遍历传入函数的 users 对象中的用户,并返回 online 属性为 true 的用户数量。 以下是一个传入 countOnline 函数的对象示例, 注意每个用户都有 online 属性,其属性值为 true 或 false:

{
  Alan: {
    online: false
  },
  Jeff: {
    online: true
  },
  Sarah: {
    online: false
  }
}
function countOnline(usersObj) {

  // 只修改这一行下面的代码

var a=0;

for (let user in usersObj){

  console.log(usersObj[user].online);

  if(usersObj[user].online == true){

    a++;

  }

}

return a;

  // 只修改这一行上面的代码

}

5. do...while

是因为不论什么情况,首先 运行循环里的代码,然后 当while(为 true(真)时,它会继续运行循环。

var ourArray = [];

var i = 0;

do {

  ourArray.push(i);

  i++;

} while (i < 5);

其他

  1. 复杂数据结构允许对象赋值为 数组[对象]的形式
var ourMusic = [
  {
    "artist": "Daft Punk",
    "title": "Homework",
    "release_year": 1997,
    "formats": [ 
      "CD", 
      "Cassette", 
      "LP"
    ],
    "gold": true
  }
];

 JavaScript Object Notation 简称 JSON 是可以用于存储数据的数据交换格式。

(当有复数个JSON对象时,对象与对象之间要用都好隔开)

{
  "artist": "Daft Punk",
  "title": "Homework",
  "release_year": 1997,
  "formats": [ 
    "CD",
    "Cassette",
    "LP"
  ],
  "gold": true
}
  1. 记录合集
// 设置

var recordCollection = {

  2548: {

    albumTitle: 'Slippery When Wet',

    artist: 'Bon Jovi',

    tracks: ['Let It Rock', 'You Give Love a Bad Name']

  },

  2468: {

    albumTitle: '1999',

    artist: 'Prince',

    tracks: ['1999', 'Little Red Corvette']

  },

  1245: {

    artist: 'Robert Palmer',

    tracks: []

  },

  5439: {

    albumTitle: 'ABBA Gold'

  }

};

 
// 只修改这一行下面的代码

function updateRecords(records, id, prop, value) {

  if ( prop != "tracks" && value != "" ){

    records[id][prop] = value

    return records;

    };

  if ( prop == "tracks" && records[id][prop] == undefined){

       records[id][prop] = [];

       records[id][prop].push(value);

       return records;

    };

  if ( prop == "tracks" && value != ""){

    records[id][prop].push(value);

    return records;

    };

  if( value == ""){

    delete records[id][prop];

    return records;

    }

}

updateRecords(recordCollection, 5439, 'artist', 'ABBA';

//recordCollection[5439]["artist"] = "test: mirco test";

//console.log(recordCollection[5439]);
  1. 使用递归代替循环

递归是函数调用自身的操作。

function multiply(arr, n) {

    if (n <= 0) {

      return 1;

    } else {

      return multiply(arr, n - 1) * arr[n - 1];

    }

  }
  1. 生成某个范围内的随机整数
  2. 使用递归来创建一个数字序列
Math.floor(Math.random() * (max - min + 1)) + min

开始的数字小于或等于截止数字。 函数必需递归调用自身

function rangeOfNumbers(startNum, endNum) {

  if (startNum > endNum){

    return [];

  }else if(startNum <= endNum){

    const countArray = rangeOfNumbers(startNum,endNum-1);

    countArray.push(endNum);

    console.log(countArray);

    return countArray;

  }

  return countArray;

};
posted @ 2021-08-19 21:57  hercule_poirt  阅读(109)  评论(0)    收藏  举报
Copyright © 2021 hercule_poirt