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

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

javascript的基础

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

var str1 = "huhx";
var str2 = new String("huhx");
console.log(str1 instanceof Object); // false
console.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); // huhx
console.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); // true
console.log(Array.isArray(arrays));   // true

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

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

四、数组的栈方法:

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

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

五、数组的队列方法:

  • shift() 方法能够移除数组中的第一个项并返回该项,同时将数组长度减 1:
var loves = ["chenhui", "huhx", 5];
var item = loves.shift();
console.log(item);  // chenhui
console.log(loves); // ["huhx", 5]
  • unshift()方法能在数组前端添加任意个项并返回新数组的长度。
var loves = ["chenhui", "huhx", 5];
var count = loves.unshift("linux", true);
console.log(count); // 5
console.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,blue
console.log(removed); // red,返回的数组中只包含一项
removed = colors.splice(1, 0, "yellow", "orange"); // 从位置 1 开始插入两项
console.log(colors); // green,yellow,orange,blue
console.log(removed); // 返回的是一个空数组
removed = colors.splice(1, 1, "red", "purple"); // 插入两项,删除一项
console.log(colors); // green,red,purple,orange,blue
console.log(removed); // yellow,返回的数组中只包含一项

九、数组的位置方法:

  • indexOf() 和 lastIndexOf() 。这两个方法都接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; // 查找4的位置
console.log(numbers.indexOf(4)); // 3
console.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); // false
var 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); // true
console.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); // 0
console.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)); //20
console.log(applysum2(10, 10)); //20
console.log(callsum(10, 20)); // 30

友情链接

时间: 2024-10-08 10:28:05

JS基础---->javascript的基础(一)的相关文章

js基础--javascript基础概念之语法

掌握一门语言 必须先掌握它的语法! javascript 的语法和C.Java.Perl 的语法有些相似.但是比它们更加宽松. javascript 中的一切都是严格区分大小写的.例如变量: demo 和 Demo 两个变量是完全不同的. javascript 标示符,所谓标示符 是指 变量.函数.属性 的名字或函数的参数.标示符的格式是按照以下规则组合的一个或多个字符. 1.第一个字符必须是字母,下划线,或 $ 符号. 2.其他字符可以是字母.下划线.$ . 或数字. 注意 不能把关键字 保留

js基础--javascript基础概念之数组(二)

js基础--javascript基础概念之数组 数组栈方法 数组可以像栈一样.栈是一种先进后出的数据结构,最先添加的数据最后一个出来.栈方法添加数据也称为 推入  移除数据称为 弹出. js为数值栈方法提供了 push()   和  pop() ;  两个方法. push() push() 方法接受参数就是你要添加进入到数组的值.push()  方法会将他们逐一添加到数组的末尾  数组的length属性会跟着更新数据. *push(多个数组元素值) 返回的修改后的数组长度 var array =

js基础--javascript基础概念之数组

js基础--javascript基础概念之数组 在ECMAScript 中 ,数组是很常用的数据类型,js中的数组和其他很多语言的数组有明显的区别.js的数组可以保持任何类型的数值,一个数组中可以保存着多个不同类型的数值.js数组大小(长度)是可以调整的.可以随着数据的添加自动增长数组长度. 创建数组: 一.数组字面量 数组字面量由一对包含数组项的方括号[]表示. var array = [ 'kin', 'cheong', 'change', 'hello', 'haha', 'hi' ];

js基础--javascript基础概念之语句(二)

js基础--javascript基础概念之语句(二)label,break,continue.. break .  continue 语句. break  continue 语句用于在循环中精确控制代码的执行,其中break语句会立即退出循环,执行循环后面的语句. continue 则退出循环后返回到再次进入循环中. 如: var num = 0; for(var i = 0; i<=100; i++){ if(i >= 10){ break; } num = i; } alert(num);

js基础--javascript基础概念之变量与作用域

js基础--javascript基础概念之变量.作用域 javascript按照ECMA-262 的定义,变量与其他语言变量有所不同.js变量时松散的,不需要事先定义变量类型的.这使得他只是一个保存特定值的一个名称.变量与其数据类型可以在脚本的生命周期内改变. 还有明白几点: JavaScript的变量作用域是基于其特有的作用域链的,JavaScript没有块级作用域. 基本类型和引用类型的值 ECMAScript 的变量有两种不同的数据类型:分别是 基本数据类型值 和 引用类型值 : 基本数据

js基础--javascript基础概念之语句

js基础--javascript基础概念之语句 ECMA-262定义了一组语句(流程控制语句) 语句定义了EMCAScript 语法. 常见的if语句. 语法: if(condition) statement1 else statement2 其中.Condition 可以是任意表达式.而且对这个表达式求值的结果不一定是布尔值.因为script 会自动调用boolean 将值转换为布尔值.如果condition 的值是 true .则执行statement1 语句  否则  执行 stateme

关于JS脚本语言的基础语法

JS脚本语言的基础语法:输出语法  alert("警告!");  confirm("确定吗?");   prompt("请输入密码");为弱类型语言: 开始时要嵌入JS代码:<script type="text/javascript"></script>: 关于写程序是需注意的基本语法:1.所有的字符全都是英文半角的:2.大部分情况下每条语句结束后要加分号:3.每一块代码结束后加换行:4.程序前呼后应:

javascript的基础知识及面向对象和原型属性

自己总结一下javascript的基础知识,希望对大家有用,也希望大家来拍砖,毕竟是个人的理解啊 1.1 类型检查:typeof(验证数据类型是:string) var num = 123; console.log(typeof num); // 1.2 in 运算符 作用:判断指定属性是否存在于指定的对象中. 如果指定的属性存在于指定的对象中,则 in 运算符会返回 true. 语法: 属性 in 对象 返回值:true 或者 false 示例: var obj = { age: 18 };

JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象JS基础讲解,工厂模式.构造函数模式.原型模式.混合模式.动态原型模式>,接下来讲一般通过那些方法完成JavaScript的继承. 原型链 JavaScript中实现继承最简单的方式就是使用原型链,将子类型的原型指向父类型的实例即可,即“子类型.prototype = new 父类型();”,实现方法如下