首页 > 代码库 > JS基础---->javascript的基础(一)

JS基础---->javascript的基础(一)

2024-11-14 01:16:02   202人阅读

　　记录一些javascript的基础知识。只是一起走过一段路而已，何必把怀念弄的比经过还长。

 

javascript的基础

一、在检测一个引用类型值和 Object 构造函数时， instanceof 操作符始终会返回 true 。

var str1 = "huhx";var str2 = new String("huhx");console.log(str1 instanceof Object); // falseconsole.log(str2 instanceof Object); // true

 二、js中没有块级作用域，定义在块中的变量是全局变量。

if (true) {    var color = "blue";}console.log(color); // blue

 三、js中创建对象的方式：

  • 使用 new 操作符后跟 Object 构造函数：
var person = new Object();person.name = "Nicholas";person.age = 29;
  •  使用对象字面量表示法：
var person = {    name : "Nicholas",    age : 29};

四、js中访问对象的属性：

var person = {    name: "huhx",    age: 56}var varName = "name";console.log(person.name); // huhxconsole.log(person[varName]); // huhx

 五、

 

js中Arrays的学习

一、创建数组的几种方式：

  • 使用 Array 构造函数：
var colors = new Array();var colors = new Array(20);var colors = new Array("red", "blue", "green");
  • 使用数组字面量表示法：
var colors = ["red", "blue", "green"];

 

二、检测数组：

var arrays = ["huhx", 45, true];console.log(arrays instanceof Array); // trueconsole.log(Array.isArray(arrays));   // true

 

三、使用 join() 方法，则可以使用不同的分隔符来构建这个字符串。

console.log(arrays.toString()); // huhx,45,trueconsole.log(arrays.join("|")); // huhx|45|true

 

四、数组的栈方法：

var user = new Array("test");var number = user.push("huhx", "linux");console.log(number); // 3console.log(user);  // ["test", "huhx", "linux"]var item = user.pop();console.log(item); // linuxconsole.log(user); // ["test", "huhx"]

 push()  将两个字符串推入数组的末尾，并将返回的结果保存在变量number中。在调用 pop() 时，它会返回数组的最后一项。

 

五、数组的队列方法：

  •  shift() 方法能够移除数组中的第一个项并返回该项，同时将数组长度减 1：
var loves = ["chenhui", "huhx", 5];var item = loves.shift();console.log(item);  // chenhuiconsole.log(loves); // ["huhx", 5]
  • unshift()方法能在数组前端添加任意个项并返回新数组的长度。
var loves = ["chenhui", "huhx", 5];var count = loves.unshift("linux", true);console.log(count); // 5console.log(loves); // ["linux", true, "chenhui", "huhx", 5]

 

六、数组的重排序方法：

  • reverse() 方法会反转数组项的顺序:
var values = [1, 2, 3, 4, 5];values.reverse();console.log(values); // [5, 4, 3, 2, 1]
  • sort() 方法按升序排列数组项:
var values = [0, 1, 5, 10, 15];values.sort();console.log(values); // [0, 1, 10, 15, 5]
  • 可以将一个比较函数传递级sort方法：
function compare(value1, value2){    return value2 - value1;}var values = [0, 1, 5, 10, 15];values.sort(compare);console.log(values); // [15, 10, 5, 1, 0]

 

七、数组的一些操作方法：

  • 如果传递给 concat() 方法的是一或多个数组，则该方法会将这些数组中的每一项都添加到结果数组中。
var colors = ["red", "green", "blue"];var colors2 = colors.concat("yellow", ["black", "brown"]);console.log(colors);  // ["red", "green", "blue"]console.log(colors2); // ["red", "green", "blue", "yellow", "black", "brown"]
  • slice() 方法可以接受一或两个参数，即要返回项的起始和结束位置。
var colors = ["red", "green", "blue", "yellow", "purple"];var colors2 = colors.slice(1);var colors3 = colors.slice(1,4);console.log(colors2); // ["green", "blue", "yellow", "purple"]console.log(colors3); // ["green", "blue", "yellow"]

 

八、splice中第一个参数是删除的位置，第二个参数是删除的数量，后续的是插入的数据并且起点是第一个参数。

var colors = ["red", "green", "blue"];var removed = colors.splice(0, 1); // 删除第一项console.log(colors); // green,blueconsole.log(removed); // red，返回的数组中只包含一项removed = colors.splice(1, 0, "yellow", "orange"); // 从位置 1 开始插入两项console.log(colors); // green,yellow,orange,blueconsole.log(removed); // 返回的是一个空数组removed = colors.splice(1, 1, "red", "purple"); // 插入两项，删除一项console.log(colors); // green,red,purple,orange,blueconsole.log(removed); // yellow，返回的数组中只包含一项

 

九、数组的位置方法：

  •  indexOf() 和 lastIndexOf() 。这两个方法都接收两个参数：要查找的项和（可选的）表示查找起点位置的索引。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; // 查找4的位置console.log(numbers.indexOf(4)); // 3console.log(numbers.lastIndexOf(4)); // 5

 

十、数组的迭代方法：

  • every() ：对数组中的每一项运行给定函数，如果该函数对每一项都返回 true ，则返回 true 。
  • filter() ：对数组中的每一项运行给定函数，返回该函数会返回 true 的项组成的数组。
  • forEach() ：对数组中的每一项运行给定函数。这个方法没有返回值。
  • map() ：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组。
  • some() ：对数组中的每一项运行给定函数，如果该函数对任一项返回 true ，则返回 true 。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];var everyResult = numbers.every(function(item, index, array) {    return (item > 2);});console.log(everyResult); // falsevar someResult = numbers.some(function(item, index, array) {    return (item > 2);});console.log(someResult); // true

filter函数的使用：

var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];var filterResult = numbers.filter(function(item, index, array) {    return (item > 2);});console.log(filterResult); // [3,4,5,4,3

map() 也返回一个数组，而这个数组的每一项都是在原始数组中的对应项上运行传入函数的结果。

var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];var mapResult = numbers.map(function(item, index, array) {    return item * 2;});console.log(mapResult); // [2,4,6,8,10,8,6,4,2]

 

js中Date的一些使用

一、时间Date的创建：

var now = new Date(); // 本地的当前时间var adate = new Date(2005, 4, 5, 17, 55, 55); // 本地时间 2005 年 5 月 5 日下午 5:55:55

 

二、时间的比较先后以及间隔：

var date1 = new Date(2007, 0, 1); var date2 = new Date(2007, 1, 1); console.log(date1 < date2); // trueconsole.log(date2 - date1); // 31天的毫秒表示：2678400000

 

三、时间的一些取值操作：

console.log(now.getDate()); // 15(15日)console.log(now.getMonth()); // 10(11月份)console.log(now.getDay()); // 2（星期二）console.log(now.getFullYear()); // 2016(2016年)

 

js中RegExp的使用

一、RegExp 的每个实例都具有下列属性：

global ：布尔值，表示是否设置了 g 标志。ignoreCase ：布尔值，表示是否设置了 i 标志。lastIndex ：整数，表示开始搜索下一个匹配项的字符位置，从 0 算起。multiline ：布尔值，表示是否设置了 m 标志。source ：正则表达式的字符串表示，按照字面量形式而非传入构造函数中的字符串模式返回。

 

二、RegExp对象的创建：

var pattern1 = /[bc]at/i;var pattern2 = new RegExp("[bc]at", "i");

 

三、RegExp对象的一些方法：

  •   exec() 接受一个参数，即要应用模式的字符串，然后返回包含第一个匹配项信息的数组
var text = "mom and dad and baby";var pattern = /mom( and dad( and baby)?)?/gi;var matches = pattern.exec(text);console.log(matches.index); // 0console.log(matches.input); // "mom and dad and baby"console.log(matches[0]); // "mom and dad and baby"console.log(matches[1]); // " and dad and baby"console.log(matches[2]); // " and baby
  • test() ，它接受一个字符串参数。在模式与该参数匹配的情况下返回true ；否则，返回 false 。
var text = "000-00-0000";var pattern = /\d{3}-\d{2}-\d{4}/;console.log(pattern.test(text)); // true

 

js中函数的使用

一、js中函数的创建：解析器会率先读取函数声明，并使其在执行任何代码之前可用（可以访问）；至于函数表达式，则必须等到解析器执行到它所在的代码行，才会真正被解释执行。

  • 函数声明语法定义：
function sum (num1, num2) {    return num1 + num2;}
  • 函数表达式定义函数：
var sum = function(num1, num2){    return num1 + num2;}

 

二、在函数内部，有两个特殊的对象： arguments 和 this：

function sum(num1, num2) {    return num1 + num2;}function applysum1(num1, num2) {    return sum.apply(this, arguments); // 传入 arguments 对象}function applysum2(num1, num2) {    return sum.apply(this, [num1, num2]); // 传入数组}function callsum(num1, num2) {    return sum.call(this, num1, num2);}console.log(applysum1(10, 10)); //20console.log(applysum2(10, 10)); //20console.log(callsum(10, 20)); // 30

 

友情链接

 

JS基础---->javascript的基础(一)


联系
我们