杭州网站建设开发,网站开发的研究现状,做视频特效的网站,叫企业做的网站可不可以自己改主题文章目录 手写new手写Mapget和post区别发起post请求的时候#xff0c;服务端是怎么解析你的body的#xff08;content-type#xff09;#xff0c;常见的content-type都有哪些#xff0c;发文件是怎么解析的#xff08;FormData#xff09;#xff0c;如果多个文件服务端是怎么解析你的body的content-type常见的content-type都有哪些发文件是怎么解析的FormData如果多个文件文件之间是如何分割的boundary说下https证书是做什么用的关于项目经验vuets的项目主要会有什么坑点附录「简历必备」前后端实战项目推荐⭐️⭐️⭐️⭐️⭐️ 「作者简介」前端开发工程师 | 蓝桥云课签约作者 | 技术日更博主 | 已过四六级 「个人主页」阿珊和她的猫 「简历必备」前后端实战项目推荐⭐️⭐️⭐️⭐️⭐️ Vue.js 和 Egg.js 开发企业级健康管理项目带你从入门到实战全面掌握 uni-app 手写new
当我们使用new关键字调用一个函数时会进行如下的操作来模拟new的工作原理 创建一个空对象作为实例。 将该对象的原型指向构造函数的prototype属性。 将构造函数的this指向该实例对象。 执行构造函数中的代码初始化实例对象。 如果构造函数返回一个对象则返回该对象否则返回创建的实例对象。
下面是一个简单的手写new的示例
function myNew(constructor, ...args) {// 创建一个空对象作为实例const instance Object.create(constructor.prototype);// 将构造函数的 this 指向该实例对象并执行构造函数const result constructor.apply(instance, args);// 如果构造函数返回了一个对象则返回该对象if (typeof result object result ! null) {return result;}// 否则返回创建的实例对象return instance;
}使用myNew来模拟new的效果
function Person(name, age) {this.name name;this.age age;
}Person.prototype.greet function() {console.log(Hello, my name is ${this.name});
};const john myNew(Person, John, 25);
john.greet(); // 输出Hello, my name is John
console.log(john.age); // 输出25以上代码演示了如何手写一个简单的new函数来创建实例对象。 实际上new还涉及到原型链等更多的细节但本示例中基本涵盖了new的核心原理。
手写Map
要手写一个简单的Map我们可以使用 JavaScript 中的对象来模拟实现。下面是一个基本的示例
function MyMap() {this.entries {}; // 用于存储键值对的对象
}MyMap.prototype.set function(key, value) {this.entries[key] value; // 将键值对存储到对象中
};MyMap.prototype.get function(key) {return this.entries[key]; // 根据键获取对应的值
};MyMap.prototype.has function(key) {return this.entries.hasOwnProperty(key); // 判断是否存在指定的键
};MyMap.prototype.delete function(key) {delete this.entries[key]; // 删除指定的键值对
};MyMap.prototype.clear function() {this.entries {}; // 清空所有的键值对
};MyMap.prototype.size function() {return Object.keys(this.entries).length; // 返回键值对的数量
};MyMap.prototype.keys function() {return Object.keys(this.entries); // 返回所有的键
};MyMap.prototype.values function() {return Object.values(this.entries); // 返回所有的值
};MyMap.prototype.entries function() {return Object.entries(this.entries); // 返回所有的键值对
};使用示例
const map new MyMap();
map.set(key1, value1);
map.set(key2, value2);
map.set(key3, value3);console.log(map.get(key2)); // 输出value2
console.log(map.has(key3)); // 输出truemap.delete(key1);
console.log(map.size()); // 输出2console.log(map.keys()); // 输出[ key2, key3 ]
console.log(map.values()); // 输出[ value2, value3 ]
console.log(map.entries()); // 输出[ [ key2, value2 ], [ key3, value3 ] ]map.clear();
console.log(map.size()); // 输出0请注意以上只是一个简单的示例实际上JavaScript 中的Map还有很多其他功能例如迭代器、forEach 方法等。为了实现一个完整的Map还需要更复杂的代码逻辑和更多的功能实现。这里给出的示例只是一个基本的参考实现。
get和post区别
GET 和 POST 是HTTP协议中最常见的两种请求方法它们有以下几个区别 请求位置 GET 请求将参数编码为URL的一部分而 POST 请求将参数包含在请求体中。 参数传递方式 GET 请求使用查询字符串来传递参数即将参数拼接在URL后面例如http://example.com/?param1value1param2value2。而 POST 请求将参数放在请求体中不会以明文形式显示在URL中。 请求长度限制 GET 请求对URL长度有限制因为URL的长度受到浏览器和服务器的限制通常不应超过2,048个字符。而 POST 请求的参数放在请求体中没有明确限制。 安全性 GET 请求的参数在URL中可能会被浏览器、代理服务器等存储或缓存起来容易被第三方获取和查看。而 POST 请求的参数在请求体中相对于 GET 请求更安全能够保护参数的机密性。 请求语义 GET 请求一般用于获取数据具有幂等性即多次请求得到的结果是相同的。POST 请求一般用于提交数据、发送请求可能会对服务器端产生影响。 缓存处理 GET 请求可以被浏览器缓存下次请求相同的URL时可以直接从缓存中获取结果提高性能。而 POST 请求会被视为非幂等的不会被缓存。
综上所述GET 适合用于获取数据传递少量参数对安全性要求较低不会对服务器产生副作用。POST 适合用于提交数据传递大量参数具有更好的安全性可能对服务器产生副作用。
需要根据实际需求和具体场景选择使用 GET 或 POST 请求方法。
发起post请求的时候服务端是怎么解析你的body的content-type常见的content-type都有哪些发文件是怎么解析的FormData如果多个文件文件之间是如何分割的boundary
当客户端发起 POST 请求时服务端需要解析请求体中的数据。解析方式取决于请求的 Content-Type。
常见的 Content-Type 类型有 application/x-www-form-urlencoded表单数据默认的 Content-Type。请求体中的参数会使用 URL 编码格式key1value1key2value2进行传递。 multipart/form-data多部分表单数据的 Content-Type。常用于上传文件。参数使用一定的分隔符分隔每个部分包含一个 HTTP 头和正文每个部分都包含一个 Content-Disposition 头。 application/jsonJSON 数据的 Content-Type。请求体中的数据是以 JSON 字符串的形式传递。
服务端根据 Content-Type 类型选择相应的解析方式来处理请求体中的数据。
对于上传文件的情况通常使用 multipart/form-data 类型的 Content-Type 并使用 FormData 对象进行发送。FormData 对象可以自动将表单数据编码为适合发送的格式并在请求头中设置正确的 Content-Type。
多个文件之间的分割是通过 boundary 来实现的。boundary 是一个随机生成的字符串前缀为 --。每个文件部分都以 --boundary 开头以 --boundary-- 结束。每个部分包含一个 HTTP 头部和正文其中 Content-Disposition 头部指定了该部分的名称以及文件名。
服务端接收到请求后会通过解析请求头中的 Content-Type 和解析具体的边界字符串来正确地分割和解析文件部分。
需要注意的是具体的实现可能因服务端框架和语言而有所不同。以上是一般性的解析方式和常见的 Content-Type 类型的介绍。在实际开发中应根据服务端的要求和框架的文档来处理 POST 请求的解析。
说下https证书是做什么用的
HTTPSHypertext Transfer Protocol Secure是一种基于传输层安全协议TLS/SSL的加密协议用于在网络上安全地传输数据。它在不安全的公共网络上创建了一个加密的通信通道确保数据的机密性和完整性。
HTTPS 使用了 SSL/TLS 协议来加密通信数据防止中间人攻击、窃听和数据篡改。它通过以下步骤实现安全的通信 建立安全连接 客户端发起 HTTPS 请求时服务端会返回一个证书包含了服务端的公钥。客户端使用这个证书验证服务端的身份并生成一个随机的对称密钥然后使用服务端的公钥对该对称密钥进行加密。这样客户端和服务端之间就建立了一个安全的连接。 加密通信 之后客户端和服务端使用对称密钥进行加密解密对通信数据进行加密保证了数据在传输过程中的机密性。 数据完整性验证 在通信过程中使用消息摘要算法来计算消息的校验和并将其附加到每个消息上。接收方收到消息后会重新计算校验和如果校验和不匹配表示消息可能被篡改过通信会被终止。
证书在 HTTPS 中起着非常重要的作用它用于验证服务端的身份。证书由数字证书颁发机构CA颁发包含了服务端的公钥以及其他与身份验证相关的信息。客户端在建立连接时会验证证书的有效性确保服务端是可信的。
通过证书验证客户端可以确认它正在与预期的服务端进行加密通信而不是被中间人进行攻击或窃听。如果证书无效或过期客户端会发出警告或中止连接。
总之HTTPS 通过加密和证书验证确保了数据的机密性、完整性和认证为用户提供了更安全的网络通信环境。
关于项目经验
在前端开发中当你描述项目经验时可以按照以下步骤进行 项目概述 开始时简要概述整个项目的背景和目标。说明项目是什么以及你的角色和职责。例如你可以介绍项目的类型如Web应用、移动应用等和行业领域。 技术栈和工具 提及项目使用的技术栈和相关工具。包括前端框架如React、Angular、Vue等、CSS预处理器如Sass、Less、版本控制系统如Git、构建工具如Webpack、Grunt、Gulp等。 功能和模块 简要描述你在项目中实现或负责的功能和模块。重点说明你在项目中的具体贡献和实现的特定功能。例如你可能负责用户界面的设计和开发与后端进行数据交互优化性能实现动画效果等。 问题与挑战 提及你在项目中遇到的问题和挑战以及你是如何解决它们的。这可以体现你的问题解决能力和技术挑战的应对能力。例如你可能处理过响应性问题、浏览器兼容性问题、性能优化问题等。 团队合作 强调你在项目开发过程中与团队合作的经验。说明你如何与设计师、后端开发人员、产品经理等合作如何协调工作并解决合作中的沟通和协调问题。 项目亮点 强调项目的亮点和成果例如迭代周期、发布版本、用户反馈等方面的成功指标或成就。说明你在项目中获得的具体结果和影响。 持续学习 提及你在项目中学到的新技术和经验以及你如何持续学习和提升自己的技能。强调你的学习能力和对前端开发领域的投入。
在描述项目经验时尽量使用具体的事例和数据来支持你的观点。使用清晰、简洁的语言避免使用行业术语和技术细节过多的表达。突出你的贡献和技术成就以及你与团队合作的能力。这样能够更好地展示你在前端开发领域的实际经验和技能。
vuets的项目主要会有什么坑点
在使用 Vue.js 结合 TypeScript (TS) 进行项目开发时可能会遇到一些常见的坑点和挑战。以下是一些可能的情况 类型定义 TypeScript 强调类型安全但 Vue.js 是基于 JavaScript 的框架原生的 Vue 组件和库可能缺乏完善的类型定义。这可能导致在类型推断、属性访问、方法调用等方面遇到困难。需要使用额外的类型声明或安装相关的类型定义库来增强类型检查。 Vue 生态系统兼容性 一些 Vue 生态系统中的插件、库和工具可能与 TypeScript 集成不完全兼容。确保选择与 TypeScript 兼容的库或者自行处理与 TypeScript 不兼容的问题。 Vue 组件的声明 使用 TypeScript 定义 Vue 组件时需要注意正确的类型声明和使用。主要包括组件的 props、data、computed、methods 等属性的类型定义以及组件实例的类型推断和访问。 Vue Router 和 Vuex 的类型定义 Vue Router 和 Vuex 是常用的 Vue.js 的路由和状态管理库。在使用 TypeScript 时需要额外的类型声明和配置以实现类型安全的路由导航和状态管理。 装饰器的使用 TypeScript 提供了装饰器decorators的特性可以用于扩展 Vue 组件和其它功能。但装饰器的使用并不是官方标准的 Vue.js 写法可能会引入一些不稳定性或与某些工具/库不兼容。 异步处理 在使用异步操作时如异步请求、Promise、async/await 等需要正确处理 TypeScript 的类型定义和类型推断以避免类型错误和编译错误。 编译配置 TypeScript 的编译配置文件tsconfig.json需要正确设置以确保 TypeScript 编译器能够正确地检查和转换 Vue 组件和 TypeScript 文件。
在开发过程中及时查阅和了解相关的 TypeScript 和 Vue.js 的文档、教程和社区资源遇到问题时可以参考官方提供的类型定义文件或与社区中音瑟波及的开发者交流分享经验。通过不断积累经验和与他人分享能够更好地应对 Vue.js 结合 TypeScript 开发中的挑战和坑点。
附录「简历必备」前后端实战项目推荐⭐️⭐️⭐️⭐️⭐️
Vue.js 和 Egg.js 开发企业级健康管理项目 带你从入门到实战全面掌握 uni-app
