object对象

看个栗子

对象是带有属性和方法的特殊数据类型。
object结构类似于python中的字典：

var cat = {"name": "Whiskers","little name":  "idiot","legs": 4,"tails": 1,"enemies": ["Water", "Dogs"]
};

object通过这种结构的化的方式储存数据，通过property访问数据。并且，能代表真实世界的对象，比如猫。

属性访问

通过点方法：

var nameValue = cat.name; – 不需要引号
var legsValue = cat.legs;

说明：JS中一切皆对象，只要是对象，都有点方法可以访问属性, 比如str.length 通过字符串的length属性获取长度。

通过[]中括号

尤其是property有空格时：
var nameValue = cat[“little name”] – 引号

通过变量访问属性：

var myDog = “Hunter”;
var dogs = {
Fido: “Mutt”,
Hunter: “Doberman”;
Snoopie: “Beagle’
}
var breed = dog[myDong];
console.log(breed); // “Doberman”

嵌套对象

var ourStorage = {"desk": {"drawer": "stapler"},"cabinet": {"top drawer": {"folder1": "a file","folder2": "secrets"},"bottom drawer": "soda"}
};

通过连用点方法（或中括号）访问嵌套对象：
ourStorage.cabinet[“top drawer”].folder2; // “secrets”
ourStorage.desk.drawer; // “stapler”

修改/新增对象的属性

var ourDog = {"name": "Camper","legs": 4,"tails": 1,"friends": ["everything!"]
};

通过点方法或中括号修改/新增：
ourDog.name = “Happy Camper”; –修改
ourDog[“name”] = “Happy Camper”;
ourDog.bark = “wang wang” –新增

删除属性

delete ourDog.bark; 或者
delete ourDog[“bark”];

构造器函数和实例化

构造函数

构造器函数首字母大写，例如：

var Car = function() {this.wheels=4;this.engines=2;this.seats=1;
}

this代表对象本身。

实例化对象

实例化一个对象 new 关键字：
var myCar = new Car()
myCar是Car构造器的实例，并且拥有Car的属性。记住，实例化对象时要使用 new 关键字。

为构造器函数传入参数

var Car = function(wheels, seats, engines) {this.wheels = wheels;this.seats = seats;this.engines = engines;
};
var myCar = new Car(4, 7,1);

为实例对象增加自己的属性

myCar.speed = 60;

设置私有属性

在构造器内用 var 声明的变量是私有属性
私有属性不能通过 obj.prop 访问
可以提供接口，来访问和修改私有属性。

var Car = function() {var speed=10; // 私有属性this.getSpeed = function() {    // 访问接口return speed;  };this.setSpeed = function(change) {    //修改接口speed +=change; };
};

this到底指代谁

例1：函数中

function test() {console.log(this);
}test();  //代指 Window

例2：对象中

var userInfo = {name: 'Lena',age: 18,show: function () {console.log(this);}
};userInfo.show();  // 代指userInfo对象本身 {name: "Lena", age: 18, show: ƒ}

例3：匿名函数中

var userInfo = {name: 'Lena',age: 18,show: function () {(function () {console.log(this);})()}
};userInfo.show();  // 代指 Window

例4：赋值this

var userInfo = {name: 'Lena',age: 18,show: function () {var that = this; // 将this所指对象赋值给that(function () {console.log(that);})()}
};userInfo.show();  // 代指userInfo对象本身 {name: "Lena", age: 18, show: ƒ}

总结：

类/对象中的this代指实例化对象本身（相当于python中的self）
函数/匿名函数中的this代指window对象：例1，例3
类/对象内部的 func 被 obj.func 执行，那么func中的this就是obj对象本身。比如例2
每个函数的作用域中都有this，因此默认都能在自己的作用域中找到，如果找不到，就从上一层找。比如日4中的that

JS中的内置对象

在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象，也可以用创建对象的方法定义变量，String、Math、Array、Date、RegExp都是JavaScript中重要的内置对象，在JavaScript程序大多数功能都是基于对象实现的。

string

创建字符串的方式：

var str1 = “hello world” //typeof: string
var str1 = new String(“hello world”) //typeof: object

字符串的属性

str.length –>获取字符串长度
var myStr = “abc”;
myStrLength = myStr.length;

字符串的方方法：

x.toLowerCase() //转小写
x.toUpperCase() //转大写
x.trim() //去字符串两边的空格
x.charAt(index) //获取指定索引的字符
x.indexOf(“a”) //查询内容的索引值，从左向右找
x.lastIndexOf(“str”) //从右往左找
x.match(regexp) //返回匹配字符串的数组，否则返回null
x.search(regexp) //返回索引
x.substr(start, length) //截取，根据起始索引和长度
x.substring(start, end) //截取，根据起始结束索引，顾头不顾尾。
x.slice(start, end) //切片，顾头不顾尾
x.replace(old, new) //替换
x.split(分隔符) //分割出来放到数组中
x.concat(str) //拼接字符串，相当于+
和python一样，JS也支持字符串的索引取值[n]
注意，如果要取到最后一个值，不能直接[-1]，应该是：
str[str.length - 1]，同理倒数第二个str[str.length - 2]

Array

JS中的数组array, 类似python的列表，同样支持多维嵌套和索引取值。

数组的创建：

方式一：
var arr = [e0, e1, e2, …,];
方式二：
var arr = new Array(e0, e1,e3,…);
方式三：
var arr = new Array(len);
arr[0]=value0;
arr[1]=value1;
…..

创建二维数组：
var arr= new Array(m);
for (var i=0; i

push – pop && unshift – shift

为列表插入元素 .push() 相当于python中的.append()
如果要插到最前面，用.unshift()
从数组删除最后一个元素.pop() 同python，并且也可以用变量接收这个pop off元素
从数组删除第一个元素.shift()
注意：不能指定索引

模拟对列的先进先出：
array.push(item)
array.shift()

map

方法迭代数组的每一个元素，并传入回调函数作为参数
返回函数的返回值构成的新的数组。
var oldArray = [1, 2, 3];
var timesFour = oldArray.map(function(val){
return val * 4;
});
console.log(timesFour); // returns [4, 8, 12]
console.log(oldArray); // returns [1, 2, 3]

reduce

迭代数组，并浓缩为一个值：
var singleVal = array.reduce(function(previousVal,
currentVal) {
return previousVal - currentVal;
}, initValue);

reduce有一个可选参数，initVal, 如果不指定该参数，
默认为数组的第一个元素。

filter

filter方法迭代数组元素，传入回调函数，判断为true的元素保留到新的列表里，false的元素被过滤。同python：
arrNew = arr.filter(function(val) {
return val >0 ; // 判断条件
});

sort

sort按照字母或数字顺序排序数组，返回排序后的数组。默认是按元素最高位的的ansi编码大小来排，比如123，小于2.
我们可以给sort方法传入一个比较大小的回调函数，看个栗子：
var array = [1, 12, 21, 2];
array.sort(function(a, b) {
return a - b;
});
将数组array从小到大排序：
如果a在b的前边，回调函数返回负数；
如果a在b的后边，回调函数返回正数；
如果相等，回调函数返回0；
注，如果要从大到小排序，只需要 return b-a; 即可

reverse

反转数组，返回反转后的数组
var myArray = [1, 2, 3];
myArray.reverse();
returns [3,2,1]

concat

拼接数组。接收数组作为参数，将其拼接到原数组的后面。
newArray = oldArray.concat(otherArray);

split

分割字符串为数组
var string = “Split me into an array”;
var array = [];
array = string.split(” “);

join

将数组中的元素用指定的分隔符连接成字符串
var joinMe = [“Split”,”me”,”into”,”an”,”array”];
var joinedString = ”;
joinedString = joinMe.join(” “);

slice

对数组进行切片，顾头不顾尾
arr.slice(start, end)

toString

将数组转为字符串
var arr = [“a”,”b”,”c”];
alert(arr.toString()); //“a,b,c”
所有对象都继承自obeject元类，元类中有toString方法，可以将任何类型转化为字符串类型。

splice

对数组指定位置进行删除和插入
arr.splice(start_index, count, value, …)
从数组指定索引处删除指定个数的元素，（可选）在删除位置插入元素。也可以通过删除0个值，添加1个或多个元素，完成在指定位置添加元素的操作。
另外，即使count大于数组长度，也不会报错。

Date

var now = new Date(); //当前时间对象
alert(now); // Mon Aug 07 2017 18:47:37 GMT+0800 (中国标准时间)，类似python中time.ctime
now.toString() //转为字符串
对象的方法：
getDate() 获取日
getDay () 获取星期
getMonth () 获取月（0-11）
getFullYear () 获取完整年份
getYear () 获取年
getHours () 获取小时
getMinutes () 获取分钟
getSeconds () 获取秒
getMilliseconds () 获取毫秒
getTime () 返回累计毫秒数(从1970/1/1午夜)

获取指定时间的时间对象
var timer = new Date(“2000-12-12”), 也可以用逗号分割

Math

不同于以上对象，需要先实例化再调用对象的方法。而Math直接是一个实例化对象。因此使用时要加Math前缀
abs(x) 返回数的绝对值。
exp(x) 返回 e 的指数。
floor(x)对数进行下舍入。
log(x) 返回数的自然对数（底为e）。
max(x,y) 返回 x 和 y 中的最高值。
min(x,y) 返回 x 和 y 中的最低值。
pow(x,y) 返回 x 的 y 次幂。
random() 返回 0 ~ 1 之间的随机数。
round(x) 把数四舍五入为最接近的整数。
sin(x) 返回数的正弦。
sqrt(x) 返回数的平方根。
tan(x) 返回角的正切。

Math.random() 生成[0,1) decimal num
Math.floor() 取整
生成一个指定范围且左右包含的随机数：
Math.floor(Math.random() * (max - min + 1)) + min
具体推理参看：https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-generate-random-whole-numbers-within-a-range/18187

JavaScript基础二相关推荐

【JavaScript基础-二维数组】JavaScript修改二维数组的某个元素时，其上下元素也受到影响
JavaScript修改二维数组的某个元素时,其上下元素也受到影响发布:2021年8月15日18:54:56 前言在研究背包问题时,一开始往往会用二维数组的形式来描述,这样会便于理解.但是,我在操 ...
网页开发基础，HTML、CSS技术、JavaScript基础
一.学习目标 1.HTML技术 2.CSS技术 3.JavaScript基础二.重要知识点 1.HTML技术超文本标记语言(英语:HyperText Markup Language,简称:HTML ...
HTML5学习笔记 —— JavaScript基础知识
HTML5学习笔记 -- JavaScript基础知识标签: html5javascriptweb前端 2017-05-11 21:51 883人阅读评论(0) 收藏举报分类: JavaScr ...
Javascript基础（二）
Javascript基础(二) 事件: 条件语句类型转换正则表达式regexp 错误抛出 void 事件: 是发生在HTML元素上的行为,可以是浏览器行为,可以是用户行为 a) html 元素添加 ...
Javascript基础回顾之(二) 作用域
本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...
JavaScript语言基础(二)
一.之前介绍了JavaScript语言基础的关键字.标识符.常用的数据类型,文章地址:JavaScript语言基础(一) ,下面来介绍JavaScript基础中的常量和变量. 1.常量:当程序运行时, ...
JavaScript 基础知识 - DOM篇(二)
7. 节点操作 7.1 节点的属性节点分类: 标签节点文本节点属性节点注释节点节点常用的属性: nodeType:节点的类型 nodeName:节点名称 nodeValue:节点值常见的节 ...
JavaScript 基础知识 - 入门篇(二)
11. 函数 11.1 函数的基础知识为什么会有函数? 在写代码的时候,有一些常用的代码需要书写很多次,如果直接复制粘贴的话,会造成大量的代码冗余: 函数可以封装一段重复的javascript代码, ...
JS学习笔记二——JavaScript 基础知识
JavaScript 基础知识一.JavaScript 变量二.JavaScript 的输出三.JavaScript 运算符四.结语一.JavaScript 变量变量是指在程序运行过程中, ...

JavaScript基础二