深入学习浅拷贝和深拷贝
想要真正搞明白深浅拷贝,你必须要熟练掌握赋值、对象在内存中的存储、数据类型等基础知识。
为了更好地掌握深浅拷贝,我们先来看一下数据类型和在内存中的存储形式。
一、JavaScript数据类型原始类型
Null:只包含一个值:null
Undefined:只包含一个值:undefined
Boolean:包含两个值:true和false
Number:整数或浮点数,还有一些特殊值(-Infinity、+Infinity、NaN)
String:一串表示文本值的字符序列
Symbol:一种实例是唯一且不可改变的数据类型
对象类型
Object:自己分一类丝毫不过分,除了常用的Object,Array、Function等都属于特殊的对象
二、原始类型和对象类型的区别1.原始类型在JavaScript中,每一个变量都需要一个内存空间来存储。内存空间被分为两种:堆内存和栈内存。
JavaScript中的原始类型的值被直接存储在栈中,在变量定义时,栈就为其分配好了内存空间。
栈内存特点:
存储的值大小固定
空间较小
可以直接操作其保存的变量,运行效率高
由系统自动分配存储空间
原始 ...
爆火的ChatGPT来体验一下吧!
最近网络上流行了一个叫ChatGPT的东西,他到底是什么东西?
ChatGPT是人工智能实验室OpenAI发布的一款对话式聊天机器人。他可以解答很多刁钻有难度的问题,一经发布就火遍科技圈。12月4日,马斯克在咨询该聊天机器人关于推特经营的建议并收到精准回复后直言其“好得吓人,我们距离强大到危险的人工智能更近了”。你没看错,图中的就是聊天机器人ChatGPT,千万不要小看这个简单的对话框,它的强大只有自己体验了之后才知道。下面教你怎么玩这个ChatGPT。
前期准备1.代理:要求是美国、印度、日本这些地址
2.准备一个国外的手机号,没有可以使用接码平台
3.注册ChatGPT账号
1.代理
我们需要科学上网工具,选择全局代理,选择美国节点就可以。不要选择香港,香港应该是不可以的。2.准备国外手机号
一般情况下,我们是没有外国手机号的。所以我们选择接码平台就可以。
接码平台:接码平台
第一步先注册一个账号,进去需要充值0.5美金就足够了,选择支付宝充值就可以。
完成这些之后,先保留我们先继续下一步。3.注册ChatGPT
OpenAI的注册地址:OpenAI地址我们直接用邮箱注册就可以,会 ...
HTML标签大全
Html代码都是由标签组成的,标签就是最基础的东西,所以我们要重点学习这些标签。本人爆肝整理了几乎所有常用的标签详解,期待各位的关注与支持。废话少说直接进入重点。
基本结构标签 1.<!-- 这是注释标签-->注释标签使我们的代码更加清楚明了,在网页中不起到任何作用也不会显示到桌面上2.文档类型声明标签:<!DOCTYPE>DOCTYPE是Document Type的简写,含义为文档类型。HTML文档基础结构中第一行就是HTML的DOCTYPE声明。3.根标签:<html>除了文章开头的文档类型声明以外,所有的HTML文档都是以<html>标签开始,以</html>结束,在<html>和</html>标签内部还包含了两个重要的标签<head>首部标签和<body>主体标签,分别标记文档的首部和主体部分。4.首部标签:<head>html文档首部以<head>开始,以</head>标签结束。<head>标签中的内容不会显示在网页的 ...
vuex四大核心元素
什么是vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
个人理解就是集中管理项目开发中用到的数据,要问什么时候用到vuex。当你构建一个中大型单页面网站的时候可以用到,如果是较为简单的页面反倒最好不要用,会显得繁琐冗余。一个简单的store模式就足够了。
vuex的四大核心元素是state、mutations、actions、getter。
Statestate的作用就是存放组件之间的共享数据,也就是说组件之间共享的状态主要存放在state属性中。
state提供唯一的公共数据源,所有共享的数据都要统一放到Store的State中进行存储。
1234//创建store数据源,提供唯一公共数据const store = new Vuex.Store({ state:{0}})
组件访问state中数据的第一种方式:
1this.$store.state.全局数据名称
组件访问state中数据的第二种方式:
12//1.从 ...
v-for指令
v-for指令可以对数组、对象、数字、字符串进行循环,并获取到源数据的每个值。
使用v-for指令,必须使用特定语法item in items,其中item是当前遍历的元素的别名,而items是源数据。
12345678910111213141516171819<!--循环数组--><li v-for="value in arr"></li><!--循环对象--><li v-for="(val,key) in object"></li><li v-for="(val,key,index) in object"></li><!--循环对象数组--><!-- 2、循环对象数组 --><ul> <li v-for="(item,i) in userList">索引:{{i}}---ID:{{item.id ...
v-if与v-show指令
v-if指令v-if指令可根据表达式的真假值判断元素是否显示。当flag为flase时DOM元素会销毁,当为true时又会重新创建。
1234567891011<div id="app"><div v-if="flag">Yes</div></div><script> var vm = new Vue({ el:"#app", data:{ flag:true } }) </script>
v-if支持在<template>元素上使用
12345678910111213<!--两种方式实现的效果是一样的--><div id="app"> <div v-if="flag">1</div> <div v-if="flag&q ...
解决a标签间隙留白问题
优选商城实战项目中碰到的a标签留白问题。
问题场景在使用<nav>和<a>标签创建导航栏的时候,<a>标签左外边距和右内边距分别设置为10px,但是上一个<a>标签和下一个之间还会出现一段空白的间隙。
12345a{ margin-left: 10px; padding-right: 10px; border-right:1px solid #b3aeae;}
实际测试你可以发现,就算不设置任何样式的话,<a>标签之间也会存在一小段空白间隙。
问题原因在开发过程中,经常会遇见这种情况,出现这种问题的原因主要是我们在写代码的时候为了代码的美观和可读性,通常会把几个<a>标签换行写,换行的话就会产生空间,在浏览器中就会出现间隙。
解决方法:方法一:既然是因为换行造成的空白间隙,那么不换行就可以了。这样的话代码就太乱了,不建议使用。
1<a>第一个</a><a>第二个</a><a>第三个</a>
方法二:可以 ...
10个实现酷炫前端效果的CSS生成工具
国内某知名招聘网站发布的一份报告显示,web前端开发工程师已成为中国互联网行业中最紧俏的职位。根据此次报告,今年三季度,互联网在上海全行业中成为人才需求最为紧迫的行业,而在当地互联网各种紧缺职位中,各类研发技术类岗位稳居前列。web前端是一个自由的行业,但要经历苦、累之后才能获得。有其他很多行业也很苦、很累,而前端是属于自由、乐趣、随心所欲的一个工种。兴趣是最好的老师。做任何事情,只有出自兴趣,才能一直坚守,从菜鸟变成大神也不是不可能的事根据设计领域的最新趋势,我选择了10个值得你关注的CSS生成工具,以帮助你构建漂亮炫酷实用的前端界面。这些工具将有助于提升设计人员和前端开发人员的工作。
1、Neumorphism
地址:https://neumorphism.io/
它创造了一种全新的UI风格。来自世界各地的设计师已经在Dribbble和Behance上看到了引人注目的中性设计。
而且这个工具,可以直接在线调试UI风格,并直接生成CSS代码。
2、带有渐变的图标
地址:https://www.iconshock.com/svg-icons/
在设计的时候,我们都注重简约。不过,有时我 ...
vue实例的常用属性和方法
常用属性vm.$el可以获取到Vue实例挂载的DOM元素,返回的是一个DOM对象。获取DOM元素之后可以为它设置样式等。
vm.$data可以获取到Vue实例的data选项数据对象,返回的是一个对象。
12345678910111213141516<div id="app">{{msg}}</div><script> var vm=new Vue({ el:"#app", data:{ msg:"welcome" } }) //vm.$el获取vm实例关联的元素/选择器,是一个DOM对象,就是上面的div console.log(vm.$el); //获取DOM元素,可以设置样式等 vm.$el.style.color="red"; vm.$el.style.background="blue";</script>
...
v-model、v-bind、v-on三大指令
v-model、v-bind、v-on三大指令的区别和使用.
v-model指令
v-model指令用于在表单控件或者组件上创建双向绑定。
1234567891011121314<div id="app"> {{msg}} <input type="text" v-model="msg"></div><script> var vm=new Vue({ el:"#app", data:{ msg:'hello world', } })</script>
v-model默认是绑定在value属性上的,所以上述代码中,v-model后面加“:value”也是可以的,即v-model:value,但一般情况下直接写v-model。
这是上面代码的运行结果,接下来我们 ...