JavaScript

数据类型

原始数据类型:

number

string

boolean

null

undefined

对象:object:

Function

Array

Date...

共有六种数据类型,五种原始数据类型,一种对象类型。

弱类型的表现,字符与数字做加法,数据的取整等。

隐式转换

字符串与数字使用会以拼接的方式计算结果。

=》字符串与数字之间的转换:巧用+-,字符串数字减0得到数字,数字加空字符串可以转换成字符。

        var str = '37';
var num = 37;
str = str - 0;
num = num + '';
console.log(str);
console.log(typeof str);
//37
//number console.log(num);
console.log(typeof num);
//37
//string
//如果符号使用相反不能发生变换

a == b情况

'1.23' == 1.23
0 == false
null == undefined
new Object() == new Object()
[1,2] == [1,2]

a === b 判断类型

null === null
undefined === undefined
NaN != NaN//NaN 不等于任何包括自己
new Object() != new Object()//对象的比较是对象的引用

在==时发生隐式转换。

包装对象:

string-->String

number-->NUmber

boolean-->Boolean

var a = "assassin";
console.log(a.length);
//8, ?为何有length属性,
a.t = 3;
console.log(a.t);
//undefined

当基本类型视图以对象的方式访问时,JavaScript回把基本类型转化为包装类型对象,可以使用对象的方法。eg:a.t = 3;这样的操作,会创建临时对象,赋值完成后临时对象马上销毁。

类型检测:

typeof 基本类型,函数对象

instanceof

Object.prototype.toString

constructor

duck type

typeof: 判断基本类型,函数对象,null失效

typeof 100   number
typeof true boolean
typeof function function typeof (undefined) undefined
typeof new Object object
typeof [1,2,3] object
typeof NAN number
typeof null object //有特殊的原因

instanceof: 判断对象类型,基于原型连的判断

obj instanceof Object
//左操作数的对象的原型链上是否有右边构造函数的prototype属性。
//注意:不同的window,iframe间的对象雷响检测不能使用instanof

Object.prototype.toString.appley():

Object.prototype.toString.appley([]) === "[object Array]";
...

IE6,7,8用这种方法判断null时还是返回[object object],其他返回[object null]

constructor:

duck type

运算符

特殊运算符

? : 条件运算符

var val = true ? 1 : 2;

, 逗号运算符

var val = (1,2,4);//val = 4

delete 删除对象的属性

in

window.x = 1;
x in window;//true

new 运算符 创建构造器的实例

语句

for...in

1.顺序不确定

2.enumerable为false时不会出现

3.for in遍历对象属性时受原型链影响

对象

对象中包含一系列属性,这些属性是无序的,每个属性都有一个字符串key和对应的value.

创建

字面量:

var obj1 = {x: 1, y: 2};

使用构造器:

function foo() {}
foo.prototype.z = 3;
var obj = new foo();
obj.x = 1;
obj.y = 2; obj.z;//3
typeof obj.toString;//function obj的原型prototype访问到foo上的原型,在访问到Object的原型,prototype是Object上的一个函数
'z' in obj;//true
obj.hasOwnProperty('z');//false,z是foo上的属性

使用Object.create(),传递对象格式创建

var obj = Object.create({x: 1});
//它的原型基于Object

对象的操作

delete删除属性

delete obj.x;

查看对象的描述器:

var descriptor = Object.getOwnPropertyDescriptor(Object, 'prototype');
descriptor.configurable;//false 他是描述对象的原型是否可以被修改,true可以被修改

delete方法不能删除全局变量,函数等,只有变量在隐式转换后可以删除。

属性枚举:

var o = {
x: 1,
y: 2
}
var key;
for(key in o) {
if(o.hasOwnProperty(key)) {
console.log(key);
}
//x,y
}

序列化

var obj = {
x: 1,
y: true,
z: [1,2,3],
nullVall: null
};
JSON.stringify(obj);
//"{"x": 1,"y": true,"z":[1,2,3],"nullVal": null}"
// 如果对象的值为undefined,则此属性但是不会序列化的
var obj = {
x: 1,
y: true,
z: [1,2,3],
nullVall: null,
value: undefined
};
JSON.stringify(obj);
//"{"x": 1,"y": true,"z":[1,2,3],"nullVal": null}"
//值如果为NaN,Infinity则会转化为null,时间会自动转换格式。

JSON.parse();解析成对象格式

数组

js 中的数组是动态的

delete删除数组中的某一项时,这一项被赋值undefined,但长度没有变化。

arr.push <=> arr[arr.length] = xxx;每次在数组末尾添加一个元素。

unshift(0):头部添加元素

arr.length -= 1 <=> arr.pop(); 删除尾部的元素

shift();头部删除一个元素

迭代

for循环,for in 不保证顺序

数组中的方法

[] => Array.prototype,数组及与数组原型链上的方法。

join: 将数组转换成字符串

var arr = [1,2,3];
arr.join();
//arr "1,2,3"
arr.join('_');
//arr "1_2_3"
//实现一个字符串的重复输出函数
function repeatString(str, n) {
return new Array(n+1).join(str);
//join会根据数组中的个数拼接字符串,创建n+1大小的数组,以传进来的参数作为拼接的单个字符拼接
}
repeatString("a",3);
//aaa

revsese:顺序的逆秩,原数组也会发生变化

sort对数组排序

默认是按照字母顺序排序,原来的数组也会被修改。要传入一个比较函数。

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

concat()合并数组

并未修改原来的数组。

slice() 返回数组的一个片段

var arr = [1,2,3,4,5];
arr.slice(1,3);//从第一个到第三个
arr.slice(1);//[2,3,4,5]
arr.slice(1,-1);//[2,3,4]负数表示从末尾开始

splice()数组的拼接

对原数组进行修改

//删除
var arr = [1,2,3,4,5];
arr.splice(2);//return [3,4,5]
arr;//1,2 arr = [1,2,3,4,5];
arr.splice(2,2);//return [3,4]
arr;//[1,2,5] //删除添加
arr = [1,2,3,4,5];
arr.splice(1,1,'a','b');//return [2]删除的元素,第二个元素删除,删除一个元素,在删除的位置添加元素
arr;//[1,'a','b',3,4,5]

forEach对数组的遍历

var arr = [1,2,3,4,5];
arr.forEach(function(x, index, a) {
console.log(x + '|' +index + '|' + (a === arr));
});
//1 | 0 | true
//x:数组元素,index索引,a数组本身
//Ie9以上

map()对函数进行映射

var arr = [1,2,3];
arr.map(function(x) {
return x+10;
});//[11,12,13]
arr;//[1,2,3]
//原数组并未改变

filter对数组进行过滤筛选

var arr = [1,2,3,4,5,6,7,8,9,10];
arr.filter(function(x,index) {
return index % 3 === 0 || x > 8;
});// return [1,4,7,8,9,10]
arr;//未改变

every&some 数组的判断

//每一项都要满足
var arr = [1,2,3,4,5];
arr.every(function(x) {
return x < 10;
})//true //只有一项即可
arr.some(function(x) {
return x === 3;
});
// true

reduce & reduceRight

var arr = [1,2,3];
var sum = arr.reduce(function(x,y) {
return x+y;
}, 0);
arr;//[1,2,3] 原数组未被修改
//第二个参数可选,遍历数组中的元素,两两进行操作,1+0,1+2,3+3
arr1 = [3,9,6];
var max = arr1.reduce(function(x, y) {
console.log(x+"|"+y);
return x>y ? x : y;
})
// 3|9
// 9|6
max;//9

reduceRight

从右往左遍历

var arr = [3,9,6];
var max = arr.reduceRight(function(x,y) {
console.log(x+"|"+y);
return x>y ? x : y;
});
// 6|9
// 9|3
max;//9

demo:

var arr2 = [
{ name: "name1", num: "1" },
{ name: "name2", num: "11" },
{ name: "name3", num: "12" },
{ name: "name4", num: "13" },
{ name: "name2", num: "1" },
{ name: "name6", num: "12" }
]; function arrObjUnique(arr, key) {
var obj = {};
return arr.reduce((item, next) => {
obj[next[key]] ? '' : obj[next[key]] = true && item.push(next);
return item;
}, []);
};
console.log(arrObjUnique(arr2, 'name'));
/*
{name: "name1", num: "1"}
{name: "name2", num: "11"}
{name: "name3", num: "12"}
{name: "name4", num: "13"}
{name: "name6", num: "12"}
*/
console.log(arrObjUnique(arr2, 'num'));
/*
name: "name1", num: "1"}
{name: "name2", num: "11"}
{name: "name3", num: "12"}
{name: "name4", num: "13"}
*/

indexOf()&lastIndexOf()查找

var arr = [1,2,3,2,1];
arr.indexOf(2);//1
arr.indexOf(99);//-1
arr.indexOf(1,1);//4,返回第二个1的索引
arr.indexOf(1,-3);//从-3的位置开始查找1 //从右往左查找
arr.lastIndexOf(2);//3
arr.lastIndexOf(2,-2);//3
arr.lastIndexOf(2,-3);// 1

一个对象是否是数组

Array.isArray([]);//true
[] instanceof Array;//true
({}).toString.apply([]) === '[object Array]';
[].constructor === Array;//true

JavaScript知识复习的更多相关文章

  1. JavaScript进阶【三】JavaScript面向对象的基础知识复习

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 【原文】前端程序员必须知道的高性能Javascript知识

    原文:前端程序员必须知道的高性能Javascript知识 想必大家都知道,JavaScrip是全栈开发语言,浏览器,手机,服务器端都可以看到JS的身影. 本文会分享一些高效的JavaScript的最佳 ...

  3. 《jQuery风暴》第2章 必须知道的JavaScript知识

    第2章 必须知道的JavaScript知识 JavaScript是jQuery应用的基础,掌握JavaScript这门语言是使用jQuery的基础条件.本章不会全面细致的讲解JavaScript的全部 ...

  4. Javascript知识——事件

    O(∩_∩)O~~又是新的一周开始了,今天还是在继续学习Javascript知识,今天主要讲了事件的知识.现在就总结下吧. 事件 事件一般是用于浏览器和用户操作进行交互.最早是 IE 和 Netsca ...

  5. Javascript知识四(DOM)

     [箴 10:4] 手懒的,要受贫穷:手勤的,却要富足. He becometh poor that dealeth with a slack hand: but the hand of the di ...

  6. 前端知识复习: JS选中变色

    前端知识复习:JS选中变色 上篇文章 :前端知识复习:Html DIV 图文混排(文字放在图片下边) Js选中图片效果 <!DOCTYPE html> <html xmlns=&qu ...

  7. 前端知识复习:Html DIV 图文混排(文字放在图片下边)

    Html知识复习之图文混排 练习练习基础 先上效果图: 废话不多说,直接贴代码: <!DOCTYPE html> <html xmlns="http://www.w3.or ...

  8. PE知识复习之PE的绑定导入表

    PE知识复习之PE的绑定导入表 一丶简介 根据前几讲,我们已经熟悉了导入表结构.但是如果大家尝试过打印导入表的结构. INT IAT的时候. 会出现问题. PE在加载前 INT IAT表都指向一个名称 ...

  9. PE知识复习之PE的重定位表

    PE知识复习之PE的重定位表 一丶何为重定位 重定位的意思就是修正偏移的意思.  如一个地址位 0x401234 ,Imagebase = 0x400000 . 那么RVA就是 1234.  如果Im ...

随机推荐

  1. 88.NODE.JS加密模块CRYPTO常用方法介绍

    转自:https://www.jb51.net/article/50668.htm 使用require('crypto')调用加密模块. 加密模块需要底层系统提供OpenSSL的支持.它提供了一种安全 ...

  2. BZOJ 2194 FFT

    思路: 题目中给的是差值一定的 那么就把b数组倒一下 不就变成 i+j=k(k为定值的了嘛) 嗯 然后搞个FFT //By SiriusRen #include <cstdio> #inc ...

  3. BZOJ 2045 容斥原理

    思路: 同BZOJ 2005 http://blog.csdn.net/qq_31785871/article/details/54314774 //By SiriusRen #include < ...

  4. Codeforces 659F Polycarp and Hay 并查集

    链接 Codeforces 659F Polycarp and Hay 题意 一个矩阵,减小一些数字的大小使得构成一个连通块的和恰好等于k,要求连通块中至少保持一个不变 思路 将数值从小到大排序,按顺 ...

  5. ie浏览器检测不到cookie的问题

    之前做项目由于客户的要求设置缓存必须由后台来设置必须使用cookie(session是没问题的),后期设置时出现了登录页面与首页来还跳转的局面.原因就是首页没检测到登录后的缓存,而后台验证到确实已经是 ...

  6. (转载) TextView使用一些小技巧

    TextView使用一些小技巧 标签: textviewandroid开发 2015-10-09 16:13 810人阅读 评论(0) 收藏 举报  分类: Android(20)  本文主要讲一些T ...

  7. 登录生成令牌token存于redis

    package com.medic.rest.province.base.home; import java.util.HashMap;import java.util.List;import jav ...

  8. 学习《数据科学入门》中文PDF+英文PDF+源代码

    数据科学是一个蓬勃发展.前途无限的行业,有人将数据科学家称为"21世纪头号性感职业".本书从零开始讲解数据科学工作,教授数据科学工作所必需的黑客技能,并带领读者熟悉数据科学的核心知 ...

  9. vue-router query和params传参(接收参数)$router $route的区别

    今天做项目时踩到了vue-router传参的坑(query和params),所以决定总结一下二者的区别. 直接总结干货!!! 1.query方式传参和接收参数 传参: this.$router.pus ...

  10. 让div垂直居中

    参考链接:https://www.cnblogs.com/softwarefang/p/6095806.html 以前我的方法总是比较粗暴,纯粹通过margin来实现,这个方法的缺点不仅在于需要多次微 ...