Javascript 入门-for Pentest

js基础（for pentest）真的很基础。

JS for pentest

tag 放置位置

内嵌式

理论上js可以写在任何第一个地方但是一般写在head标签里或者body标签里

<script type="application/javascript"> 
alert("内嵌式");
</script>

<script>alert("内嵌式");</script>

外链式

首先新建一个文件类型为.js的文件，然后在该文件中写js语句，通过script标签对引入到html页面中。指定关键字延迟加载js：defer

<script src="js文件路径地址"/>⭐️
//defer
<script defer src="js文件路径地址"/>⭐️

行内式

直接书写在标签身上，是一个简写的事件，所以又称之为事件属性。 onclick单击事件

<input type="button" value="点我呀!" onclick="alert('暗月渗透测试培训');">
<button onclick="alert('恭喜你,加入暗月渗透测试培训');">点我呀!</button>

内嵌式和外链式的区别

内嵌式：将js代码直接写在html页面中，当页面加载时，js代码也会被加载，执行，所以内嵌式的js代码会阻塞页面的加载，影响页面的性能。
外链式：将js代码写在单独的js文件中，通过script标签引入到html页面中，当页面加载时，js代码不会被加载，执行，只有当页面加载完成后，js代码才会被加载，执行，所以外链式的js代码不会阻塞页面的加载，不会影响页面的性能。

数据类型

Number、String、Boolean、Null、Undefined、Object、Symbol

var num = 1;
var str = 'hello';
var bool = true;
var nul = null;
var und = undefined;
var obj = {name:'zhangsan',age:18};
var sym = Symbol();

Number

var num = 1;
var num = 1.1;
var num = 1e2; //100
var num = 1e-2; //0.01
var num = 0xff; //255 - 16进制 ⭐️
var num = 0b1111; //15 - 2进制
var num = 0o17; //15 - 8进制 ⭐️
var num = infinity; //无穷大

parseInt(..)    //将某值转换成数字，不成功则NaN⭐️
parseFloat(..) //将某值转换成浮点数，不成功则NaN
isNaN(..) //判断某值是否为NaN
isFinite(..) //判断某值是否为有限数

String

var str = 'hello';
var str = "hello";
var str = `hello`; 
var words = 'hello' + 'world'; //helloworld
var words = 'hello' + 1; //hello1

words = "hello world";
words.length //11
words[0] //h
words.At(0) //h

words.indexOf('wor') //6 搜索字符串中是否包含某个字符串，如果包含则返回第一个字符的索引，否则返回-1
words.search('o') ⭐️//4 搜索字符串中是否包含某个字符串，如果包含则返回第一个字符的索引，否则返回-1
words[6] //w
words.charAt(6) //w

words.slice(0,5) //hello 0-5⭐️
words.slice(6) //world 6-end⭐️

words = "   hello world   ";
words.trim()        //   hello world   
words.trimLeft()    //hello world
words.trimRight()   //   hello world

words.toUpperCase() //   HELLO WORLD
words.toLowerCase() //   hello world
words.split(' ')    //["hello", "world"]⭐️ string to list
words.split('')     //["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]
words.replace('hello','hi') //   hi world
words.replace(/hello/g,'hi') //   hi world

words= "hello world";
words.substr(0,5) //hello

Boolean

var bool = true;
var bool = false;

==   比较值相等
!=   不等于
===  比较值和类型相等 ⭐️
!==  不等于
||   或
&&   且

1 == '1'
true
1 === '1'
false

判断类型

typeof

var num = 1;
typeof num //number

数据结构

list、dict

list = [1,2,3,4,5]
dict = {'name':'zhangsan','age':18}

数组

var arr = [1,2,3,4,5];
var arr=new Array();

push()：将一个或多个元素添加到数组末尾，并返回修改后的数组。
pop()：删除并返回数组的最后一个元素。
shift()：删除并返回数组的第一个元素。
unshift()：将一个或多个元素添加到数组的开头，并返回新的长度。
slice(start, count)：返回一个新数组，包含从起始位置到结束位置（不包括结束位置）的所有元素。
splice(start, deleteCount, item1, item2, …)：从指定位置开始修改数组，可以删除元素、插入新元素或替换现有元素，并返回一个包含被删除元素的数组。
concat(…arrays)：连接两个或多个数组（返回新数组）。
reverse()：反转数组中元素的顺序(操作源数组)。
sort()：对数组中的元素进行排序。
indexOf(searchElement, fromIndex)：返回指定元素在数组中第一次出现的位置。
lastIndexOf(searchElement, fromIndex)：返回指定元素在数组中最后一次出现的位置。

slice() 方法返回一个新的数组，包含从原始数组中指定起始位置到结束位置（不包括结束位置）的所有元素。它接受两个参数：

起始位置（可选）：从哪个位置开始提取元素。如果省略，则默认从索引 0 开始。结束位置（可选）：在哪个位置结束提取元素。如果省略，则默认提取到数组末尾。

splice() 可以删除或者替换，它可以用来修改数组。它接受三个参数：

起始位置（必需）：从哪个位置开始修改数组。
删除数量（可选）：要删除多少个元素。如果省略，则从起始位置开始删除剩余的所有元素。
插入的元素（可选）：要插入到数组中的新元素。

splice() 方法将修改原始数组并返回一个包含被删除元素的数组，如果没有元素被删除则返回一个空数组。

数组遍历

var arr = [1,2,3,4,5];
for(var i=0;i<arr.length;i++){
    console.log(arr[i]);
}

for(i in arr){
    console.log(arr[i]);
}

函数

function fn(){
    console.log('hello world');
}
fn();

参数

var x = myFunction(7, 8);        // 调用函数，返回值被赋值给 x
function myFunction(a, b) {
    return a * b;                // 函数返回 a 和 b 的乘积
}

匿名函数

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

自执行函数（创建函数并且自动执行）

(function(arg){
    console.log('hello world' + arg);
})('AAAA');

//output hello worldAAAA

字典

var dict = {'name':'zhangsan','age':18};
dict['name'] //zhangsan
dict.name //zhangsan

遍历字典

for(k in dict){
    console.log(k,dict[k])}

序列化json

var dict = {'name':'zhangsan','age':18};
var str = JSON.stringify(dict); //序列化成json字符串
var dict2 = JSON.parse(str); //反序列化成json对象

转义url编码

decodeURI( )            URl转译，不转义URI组件
decodeURIComponent( )   URI转译，转义URI组件如://等
encodeURI( )            
encodeURIComponent( )   
escape( )               转译，转义URI组件如等
unescape( )             给转义字符串解码
URIError                由URl的编码和解码方法抛出

escape() 和 unescape() 函数是最古老的字符编解码函数。它们用于将非 ASCII 字符转换为 ASCII 字符，并且在大多数情况下已经被废弃了；因为它们无法正确地处理某些字符，特别是 Unicode 字符。

encodeURI() 和 decodeURI() 函数用于对 URI 进行编码和解码。URI 是指统一资源标识符，例如网址。URI 中有保留字符（例如斜杠、冒号、问号等）不会进行编码

encodeURIComponent() 和 decodeURIComponent() 函数与 encodeURI() 和 decodeURI() 函数类似，但它们会对更多的字符进行编码。比如，斜杠。

eval

这个函数在严格模式已经被禁用。

eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。

eval("alert('xss')");

Date

var date = new Date();
date.getFullYear(); //获取年份 ，如2018
date.getMonth(); //获取月份，如1
date.getDate(); //获取日期，如13
date.getDay(); //获取星期几，如1
date.getHours(); //获取小时，13
date.getMinutes(); //获取分钟，如40
date.getSeconds(); //获取秒，如19
date.getMilliseconds(); //获取毫秒，如1
date.getTime(); //获取时间戳，如1678696819975

增加时间

var date = new Date();
date.setHours(date.getHours()+1); //增加1小时

类

js中没有类的概念，只有对象的概念，所以js中的类只是一个函数而已，只是这个函数的作用是用来创建对象的。

function Person(name,age){
    this.name = name;
    this.age = age;
    this.say = function(){
        console.log('hello world');
    }
}

创建对象

var p = new Person('zhangsan',18);
p.say();

js 目前支持了class关键字，但是它只是一个语法糖，本质上还是一个函数，所以它的继承和原型链还是和之前一样的。

它的函数不需要加function关键字；

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    say() {
        console.log("Hello");
    }
    setname(name) {
        this.name = name;
    }
    getname() {
        return this.name;
    }
}

原型

JavaScript是一种基于原型的面向对象语言。在JavaScript中，每个对象都有一个指向另一个对象的原型。原型是一个包含共享属性和方法的对象，它充当对象之间的模板或蓝图。如果一个对象需要访问另一个对象的属性或方法，它会沿着原型链向上查找，直到找到该属性或方法为止。

除了共享属性和方法，原型对象还可以用于实现继承。在 JavaScript 中，你可以使用 Object.create() 方法创建一个新对象，并将其原型设置为另一个对象。这种方式创建的对象继承了原型对象的所有属性和方法。

例如，假设你有一个名为 Animal 的对象，它具有一些通用的属性和方法（如 eat() 和 sleep()）。现在，你想创建一个 Cat 对象，该对象既拥有 Animal 对象的所有属性和方法，又具有自己的一些特定属性和方法。你可以通过以下方式实现：

var Animal = {
    eat() {
        console.log('动物正在进食')
    },
    sleep() {
        console.log('动物正在睡觉')
    }
}

// 创建一个 Cat 对象，并将其原型设置为 Animal 对象
var cat = Object.create(Animal)
// 在 Cat 对象上定义自己的属性和方法
cat.meow = function () {
    console.log('喵喵喵')
}

以上代码中，我们先定义了一个 Animal 对象，该对象具有 eat() 和 sleep() 方法。然后，我们使用 Object.create() 方法创建了一个新的 Cat 对象，并将其原型设置为 Animal 对象。最后，我们在 Cat 对象上定义了一个 meow() 方法，使其具有自己的行为。

通过这种原型链的方式，我们可以很容易地实现面向对象编程的核心概念：封装、继承和多态。

笔记记了是一回事，脑子记住是另一回事，但是我感觉脑子记不住，主要是我不常用