Input URL to the rendering process
1. Enter a URL in the browser 2. Resolve the domain name into an IP address through DNS. The domain name is just a mapping with the IP address. The process of domain name resolution is actually the process of restoring the domain name to an IP address (if the input is an IP address, this step is omitted) 3. According to the resolved IP address and port, the browser initiates an http request 4. The browser establishes a connection with the server Tcp connection (establishment process: three-way handshake)
- The first handshake: When establishing a connection, the client sends a syn packet (syn=j) to the server, and enters the SYN_SENT state, waiting for the server to confirm;
- Second handshake: When the server receives the syn packet, it must confirm the client's SYN (ack=j+1), and at the same time send a SYN packet (syn=k), that is, the SYN+ACK packet, and the server enters the SYN_RECV state;
- The third handshake: The client receives the SYN+ACK packet from the server, and sends an acknowledgment packet ACK (ack=k+1) to the server. After the packet is sent, the client and server enter the ESTABLISHED (TCP connection successful) state, which is completed three times shake hands.
- Wave for the first time: Client sends a FIN to close the data transfer from Client to Server, and Client enters FIN_WAIT_1 state.
- The second wave: After the Server receives the FIN, it sends an ACK to the Client, confirming that the serial number is the received serial number + 1 (same as SYN, one FIN occupies a serial number), and the Server enters the CLOSE_WAIT state.
- Wave for the third time: Server sends a FIN to close the data transfer from Server to Client, and Server enters LAST_ACK state.
- Fourth wave: After the Client receives the FIN, the Client enters the TIME_WAIT state, and then sends an ACK to the Server, confirming that the serial number is the received serial number +1, and the Server enters the CLOSED state, completing the four waves. 5. After the browser establishes a connection through the three-way handshake of tcp, it sends an HTTP request to the server, requesting data packets. 6. The server receives and processes the HTTP request, finds resources based on the request information, and returns response information 7. The browser receives HTTP Response 8. If the status code in the message indicates that the request is successful, the returned resource (such as an HTML file) is accepted. So far, the browser has obtained an HTML document and starts to parse it in order to render the document. 11. At this point, the browser has received an HTML document and started to parse it in order to render the document. 12. The page rendering ends. 13. Waved four times to close the TCP connection.
Flatten the object
function copy(input) {
let result = {
};
const flatten = (params, key) => {
if (params instanceof Array) {
params.forEach((param, index) => {
if (param instanceof Object || param instanceof Array) {
flatten(param, `${
key}[${
index}]`);
} else {
result[`${
key}[${
index}]`] = flatten(param, `${
key}[${
index}]`);
}
});
} else if (params instanceof Object) {
for (var itemKey in params) {
const itemValue = params[itemKey];
if (itemValue instanceof Array) {
flatten(itemValue, itemKey);
} else if (itemValue instanceof Object) {
flatten(itemValue, itemKey);
} else if (itemValue === null || itemValue === undefined) {
} else {
if (key) {
result[`${
key}.${
itemKey}`] = flatten(itemValue, itemKey);
} else {
result[itemKey] = flatten(itemValue, itemKey);
}
}
}
} else {
return params;
}
};
flatten(input);
return result;
}
let input = {
a: 1,
b: [
1,
2,
{
c: true,
},
[3],
],
d: {
e: 2,
f: 3,
},
g: null,
};
copy(input);
Array subtraction
let subSet = function (arr1, arr2) {
var set1 = new Set(arr1);
var set2 = new Set(arr2);
var subset = [];
for (let item of set1) {
if (!set2.has(item)) {
subset.push(item);
}
}
return subset;
};
String decoding
function decodeString(input) {
let i1 = input.lastIndexOf("[");
let i2 = input.indexOf("]", i1);
if (i1 > -1 && i2 > -1) {
let oldStr = input.substring(i1, i2 + 1);
let number = "";
for (let i = i1 - 1, j = 0; ; i--, j++) {
if (input[i]) {
if (!(input[i] >= 0)) {
break;
} else {
number = input[i] + number;
}
}else{
break;
}
}
function change(str, num) {
let newStr = "";
for (let i = 0; i < num; i++) {
newStr += str;
}
return newStr;
}
input = input.replace(number + oldStr, change(oldStr.slice(1, -1), number));
return decodeString(input);
} else {
return input;
}
}
let str = '2[3[a]2[bc]]'